/* noto-sans-300 - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Noto Sans';
    font-style: normal;
    font-weight: 300;
    src: url('../fonts/noto-sans-v36-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* noto-sans-regular - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Noto Sans';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/noto-sans-v36-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* noto-sans-500 - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Noto Sans';
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/noto-sans-v36-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* noto-sans-700 - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Noto Sans';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/noto-sans-v36-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* noto-sans-900 - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Noto Sans';
    font-style: normal;
    font-weight: 900;
    src: url('../fonts/noto-sans-v36-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

:root {
    --weiss: #fff;
    --schwarz: #000;
    --grau: #272833;
    --hellgrau: #e6e6e6;
    --gelb: #fdc303;
    --dunkelblau: #04529e;
    --hellblau: #0d8fd6;
    --standardtransition: ease all 0.3s;

    --cookiemanmain: #272833;
    --cookiemanneutral: #ffffff;
    --mapsoverlaygrau: rgba(245,245,245,0.2);
    --cookiemanhellgrau: #e6e6e6;
    --cookiemanbgdark: #000000;
}

html, body {
    font-family: 'Noto Sans', Arial, Verdana, sans-serif;
    font-weight: 400;
    font-size: 22px;
    color: var(--grau);
    margin: 0;
    padding: 0;
    width: 100%;
    float: left;
    clear: both;
    font-style: normal;
    line-height: 1.5em;
    color: var(--schwarz);
    word-break: break-word;
    hyphens: auto;
}

.skip-link {
    display: block;
    transform: translate(-9999px);
    position: absolute;
}

.skip-link:focus {
  transform: translate(0)
}

:is(a, button, input, textarea, summary){
    --outline-size:max(2px,0.08em);
    --outline-style: solid;
    --outline-color: currentColor;
}

:is(a, button, input, textarea, summary):focus{
    outline:
        var(--outline-size) 
        var(--outline-style)
        var(--outline-color);
    outline-offset:var(--outline-offset,var(--outline-size));
}

.symbol {
    display: inline-block;
}

.symbol::before {
    content: "\0040";
}

* {
    outline: none;
}

a{
    min-height: 24px;
}

a, a:hover, a:active, a:visited {
    color: var(--dunkelblau);
    text-decoration: none;
}

figure.image > a {
    display: table;
}

.audio-embed, .audio-caption, .video-caption {
    float: left;
    clear: both;
    width: 100%;
}

p {
    margin: 0 0 10px 0;
}

.text-right {
    text-align: right;
}

.text-left {
    text-align: left;
}

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

.text-justify {
    text-align: justify;
}

strong{
    font-weight: 700;
}
img {
    max-width: 100%;
    height: auto;
}

.video[data-type="external"] .video-embed {
    padding-top: 0;
    aspect-ratio: 16/9;
    overflow: hidden;
}

.videobox,
.video-embed {
    position: relative;
}

.videoiframelink {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    overflow: hidden;
    text-indent: -9999px;
    color: transparent;
} 

.ce-gallery.videocontainer {
    width: 100%;
	float: left;
	clear: both;  
}

.ce-gallery.videocontainer .video-column {
    max-width: 100%;
    float: left;
}

.ce-gallery.videocontainer figure.video {
	display: block;
}

/* -- Headervideo -- */
.frame-type-textmedia.frame-layout-11 > .rahmen {
    width: 100% !important;
    max-width: none !important;
    float: left !important;
    clear: both !important;
    margin: 0 !important;
    display: block !important;
}

.frame-type-textmedia.frame-layout-11 .ce-gallery {
    margin: 0;
    width: 100%;
    float: left;
    clear: both;
    position: relative;
}

.frame-type-textmedia.frame-layout-11 .ce-gallery::before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

.frame-type-textmedia.frame-layout-11 .video-embed .video-preview {
    height: 100%;
}

.frame-type-textmedia.frame-layout-11 .video-embed .video-preview img {
    width: 100%;
    max-width: none;
    height: auto;
}

.frame-type-textmedia.frame-layout-11.loadingok .video-embed .video-preview {
    display: none;
}

.frame-type-textmedia.frame-layout-11 .video[data-type="internal"] .video-embed .video-embed-item {
    width: 100%;
}

body.lb_body {
    height: auto !important;
    max-width: 800px;
    width: 90vw;
}

#lightbox {
    width: 96%;
    margin: 10px 2%;    
}
/* -------------------------------------------------------------- */
/* -- Header & Navi -- */
#oben{
    float: left;
    clear: both;
    width: 90%;
    padding: 0 5%;
    position: fixed;
    background: var(--weiss);
    z-index: 5;
    border-top: 10px solid var(--hellgrau);
}

#oben > .frame-default{
    float: left;
    clear: none;
    margin: 0;
}

#oben > .frame-default .ce-gallery{
    margin: 20px 0;
}

#oben.scroll{
    box-shadow: 0 -10px 15px var(--grau);
}

#oben .image-embed-item{
    max-width: 270px;
    height: auto;
    transition: ease-out all 0.3s;
}

#oben.scroll .image-embed-item{
    max-width: 250px;
    height: auto;
}

#oben.scroll .hnavi > li{
    padding-top: 30px;
}

.hnavi{
    float: right;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.hnavi > li{
    display: inline-block;
    float: left;
    position: relative;
    transition: ease-out all 0.3s;
    padding-top: 34px;
    padding: 34px 7px 3px;
}

.hnavi > li > a{
    float: left;
    padding: 15px 10px;
    margin: 0 10px 0;
    font-weight: 700;
    color: var(--hellblau);
    transition: ease all 0.3s;
    font-size: 20px;
}

.unavi {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    list-style-type: none;
    margin: 0;
    padding: 5px 5px 20px 5px;
    background: var(--hellgrau);
    display: none;
    transition: ease all 0.3s;
    /* box-shadow: 0px 10px 10px rgb(39 39 39 / 35%); */
    width: max-content;
    min-width: calc(100% - 10px);
}

.hnavi li:last-child .unavi{
    left: -40px;
}

.unavi::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 20px;
    clip-path: polygon(0 0, 100% 100%, 100% 0);
    background: var(--hellgrau);
    box-shadow: 0px 10px 10px rgb(39 39 39 / 35%);
}

.unavi li{
    display: block;
    clear: both;
}

.unavi li a{
    padding: 5px;
    color: var(--hellblau);
    float: left;
    margin: 2px 40px;
    width: calc(100% - 90px);
    transition: ease all 0.3s;
    font-weight: 700;
    font-size: 18px;
    hyphens: auto;
    transition: 0.2s;
}

.unavi > li > a:hover,
.unavi > li.act > a,
.hnavi > li.act > a,
.hnavi > li:hover > a,
.uunavi > li.act > a,
.uunavi > li > a:hover {
    color: var(--dunkelblau);
    text-decoration: underline;
}

.hnavi > li:hover .unavi,
.hnavi > li[data-toggled="on"] .unavi{
    display: block;
}

.hnavi > li[data-toggled="off"] .unavi{
    display: none;
}

/* .hnavi > li > a::before{
    content: '';
    position: absolute;
    left: 10px;
    top: 0;
    height: 100%;
    width: 4px;
    background: var(--weiss);
} */

.hnavi > li:hover {
    background: var(--hellgrau);
}

/* .hnavi > li:hover > a::before,
.hnavi > li.act > a::before,
.unavi li:hover a::before{
    background-color: var(--gelb);
}

.hnavi > li:last-child > a{
    color: var(--gelb);
} */

#header{
    float: left;
    clear: both;
    width: 100%;
    margin-top: 104px;
    /* max-height: calc(100vh - 120px); */
    opacity: 0;
    position: relative;
}

#header .ce-gallery {
    max-height: calc(100vh - 120px);
    overflow: hidden;
    max-height: 600px;
}

#header .owl-item * {
    float: left;
    clear: both;
    width: 100%;
}

#header.sub{
    max-height: 600px;
    overflow: hidden;
}

#header .ce-bodytext{
    position: absolute;
    left: 10%;
    bottom: -10px;
    padding: 20px;
    color: var(--weiss);
    background: var(--hellblau);
    font-weight: 500;
    font-size: 20px;
    z-index: 2;
    max-width: 550px;
    line-height: 1.4em;
    font-weight: 700;
}

#header .ce-bodytext::before,
#header .ce-bodytext::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: calc(100% - 1px);
    height: 20px;
    background: var(--hellblau);
    clip-path: polygon(0 100%, 100% 100%, 100% 0);
}

#header .ce-bodytext::after {
    bottom: auto;
    top: calc(100% - 1px);
    clip-path: polygon(0 0, 100% 100%, 100% 0);
}

#header .ce-gallery{
    margin: 0;
}

#header .ce-bodytext strong {
    position: relative;
    padding-bottom: 20px;
    margin-bottom: 20px;
    display: inline-block;
    font-size: 30px;
}

#header .ce-bodytext strong::after {
    content: '';
    position: absolute;
    left: -45px;
    bottom: -5px;
    height: 10px;
    background-color: var(--gelb);
    width: 155px;
}

.down{
    position: absolute;
    color: var(--gelb);
    right: calc(25% - 50px);
    width: 100px;
    height: 61px;
    bottom: 40px;
    background: url(/fileadmin/cn_website/images/arrow-white.png) center center;
    background-size: contain;
    cursor: pointer;
    z-index: 2;
    transition: ease-out all 0.3s;
}

.sub .down{
    top: 660px;
}

.down:hover{
    transform: scale(1.1);
}

/* -- mobile Navi -- */
.mob_button {
    position: absolute;
    right: 2%;
    top: 15px;
    z-index: 5;
    margin: 0;
    width: 60px;
    height: 60px;
    cursor: pointer;
    display: none;
}

.mob_button span {
    background-color: var(--dunkelblau);
    height: 3px;
    left: 7px;
    margin-top: -1px;
    position: absolute;
    top: 50%;
    width: 45px;
    transition: all 0.3s ease 0.3s;
}

.mob_button span::after,
.mob_button span::before {
    backface-visibility: hidden;
    background-color: var(--dunkelblau);
    content: '';
    height: 3px;
    position: absolute;
    transform: translateZ(0px);
    transition: all 0.3s ease 0.3s;
    width: 100%;
    display: block;
}

.mob_button span::before {
    transform: translateY(-12px);
}

.mob_button span::after {
    transform: translateY(12px);
}

.mobnavvisible.mob_button span {
    background-color: transparent;
}

.mobnavvisible.mob_button span::before {
    transform: translateY(0px) rotate(-45deg);
}

.mobnavvisible.mob_button span::after {
    transform: translateY(0px) rotate(45deg);
}
/* -- mobile Navi -- */

/* -- Header & Navi -- */

/* -- Inhaltsbereich -- */
h1, h2, h3, h4, h5{
    margin: 0;
    line-height: 1.2em;
}

h1, h2{
    font-size: 36px;
    color: var(--dunkelblau);
    font-weight: 700;
    margin-bottom: 35px;
    padding-bottom: 25px;
    position: relative;
}

.ce-nowrap .ce-bodytext {
    padding-left: 20px;
}

.frame-textkacheln ::after,
.frame-textkacheln h2:not(.folgt)::after {
    display: none;
}

h1::after, h2:not(.folgt)::after{
    content: '';
    position: absolute;
    left: -20px;
    bottom: -5px;
    width: 140px;
    height: 10px;
    background: var(--gelb);
}

h1.ce-headline-center::after, h2.ce-headline-center:not(.folgt)::after{
    left: calc(50% - 80px);
}

h1.ce-headline-right::after, h2.ce-headline-right:not(.folgt)::after{
    left: calc(100% - 160px);
}

#inhaltsbereich a:not(.more){
    color: var(--dunkelblau);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    transition: var(--standardtransition);
}

#inhaltsbereich a:not(.more):hover{
    text-decoration-thickness: 3px;
}

h2.folgt, h3{
    font-size: 28px;
    margin-bottom: 40px;
    padding-bottom: 0;
    color: var(--hellblau);
}

h3.zweizeilig{
    margin-bottom: 0;
}

h3.folgt, h4{
    font-size: 27px;
    font-weight: 500;
    color: var(--hellblau);
}

h4.folgt, h5{
    font-size: 20px;
    color: var(--hellblau);
    font-weight: 400;
}

#inhaltsbereich{
    float: left;
    clear: both;
    width: 100%;
    margin-top: 90px;
}

#inhaltsbereich.sub.ohne{
    margin-top: 150px;
}

#inhaltsbereich > .frame{
    float: left;
    clear: both;
    width: 100%;
    margin: 0;
}

#inhaltsbereich > .frame.frame-space-after-1{
    margin-bottom: 0;
}

#inhaltsbereich > .frame.frame-space-after-1 + .frame{
    margin-top: 0;
}

#inhaltsbereich > .frame:not(.breadcrumb) + .frame{
    margin-top: 125px;
}

#inhaltsbereich > .frame.breadcrumb{
    margin: 30px 0 80px;
}

#inhaltsbereich > .frame > .rahmen,
#footer > .frame > .rahmen{
    max-width: 1350px;
    width: 90%;
    margin: 0 auto;
}

.ce-intext.ce-left .ce-gallery{
    margin-right: 110px;
}

.ce-intext.ce-right .ce-gallery{
    margin-left: 110px;
}

.ce-intext.ce-nowrap .ce-gallery{
    margin-top: 90px;
}

.tx_cn-columns .row > div > div{
    width: 100%;
}

.ce-bodytext a{
    text-decoration: underline;
    transition: var(--standardtransition);
}

.ce-bodytext a:hover{
    text-decoration-color: var(--gelb);
}

a.more{
    text-decoration-color: var(--gelb);
    text-decoration: none;
    transition: var(--standardtransition);
}

a.more:hover{
    text-decoration: underline;
}

.table { 
    text-align: center;
    margin: 0;
}

table{
    border-collapse: collapse;
}

#inhaltsbereich .table th,
#inhaltsbereich .table td{
    padding: 2px 10px;
    border: 1px solid var(--dunkelblau);
}

.frame-bild50 .ce-textpic,
.frame-schraeg {
    position: relative;
}

.frame-bild50 .ce-textpic{
    margin-left: -20px;
}

.frame-bild50 .ce-gallery,
.frame-schraeg .ce-gallery {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 30%;
    margin: 0 0 0 0 !important;
}

.frame-schraeg .ce-gallery {
    right: 5%;
    left: auto;
}

.frame-bild50 .ce-gallery .ce-row {
    position: relative;
    padding-left: 20px;
    width: calc(100% - 20px);
}

.frame-bild50 .ce-gallery .ce-row:first-child:after {
    content: '';
    position: absolute;
    left: 0px;
    width: 70px;
    height: 70px;
    top: 40px;
    background: url(/fileadmin/cn_website/images/circle.png) center center;
    background-size: contain;
}

/* .frame-bild50 .ce-gallery * ,*/
.frame-schraeg .ce-gallery * {
    margin: 0 0 0 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.frame-bild50 .ce-bodytext,
.frame-schraeg .ce-bodytext {
    float: left;
    clear: both;
    width: calc(70% - 40px);
    max-width: 700px;
    margin-left: calc(30% + 20px);
}

.frame-schmal .ce-right .ce-bodytext,
.frame-bild50 .ce-right .ce-bodytext{
    margin-left: 0;
    margin-right: calc(30% + 20px);
}

.frame-schmal .ce-right .ce-gallery,
.frame-bild50 .ce-right .ce-gallery{
    left: inherit;
    right: 0;
}

.frame-schraeg .ce-bodytext {
    width: calc(70% - 100px);
    margin: 0 0 0 0;
}

.frame-textkacheln{
    opacity: 0;
}

.frame-textkacheln .row .col-,
.frame-kacheln .row .col-{
    width: 31.3%;
    margin: 0 1% 15px 0;
    float: left;
    position: relative;
    clear: none;
}

.frame-kacheln .row .col-:nth-child(3n+2){
    transform: translateY(150px);
}

.frame-textkacheln .row .col-{
    width: calc(32.25% - 40px);
    padding: 10px 20px;
    box-shadow: 0 0 0 1px var(--dunkelblau);
    overflow: hidden;
}

.frame-textkacheln .row .col-.bild{
    padding: 0;
    width: 32.25%;
}

.frame-textkacheln .row .col-.bild .ce-gallery{
    margin: 0;
}

.frame-textkacheln .row .col-.bild .frame,
.frame-textkacheln .row .col-.bild .frame .rahmen,
.frame-textkacheln .row .col-.bild .frame .ce-textpic,
.frame-textkacheln .row .col-.bild .frame .ce-gallery,
.frame-textkacheln .row .col-.bild .frame .ce-row,
.frame-textkacheln .row .col-.bild .frame .ce-column,
.frame-textkacheln .row .col-.bild .frame .image,
.frame-textkacheln .row .col-.bild .frame picture,
.frame-textkacheln .row .col-.bild .frame img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.frame-textkacheln .row .col- header{
    margin-bottom: 15px;
}

.frame-textkacheln .cn_multicontent_teaser{
    margin-bottom: 40px;
    max-width: 60%;
}

.frame-textkacheln:not(.frame-layout-3) .row .col-:nth-child(even){
    margin-top: 80px;
}

.frame-textkacheln .row .col-:nth-child(1n+5){
    margin-top: 0;
}

.frame-textkacheln:not(.frame-layout-3) .row .col-:nth-child(2n+5){
    margin-top: -80px;
}

.frame-textkacheln .row .col-:nth-child(4n+0){
    margin-right: 0;
}

.frame-textkacheln .row .block {
    float: left;
    clear: both;
    width: 100%;
}

.frame-textkacheln .row .block + .block{
    margin-top: -105px;
}

.frame-kacheln .row .col- header{
    position: absolute;
    bottom: 0;
    width: calc(100% - 90px);
    text-align: center;
    padding: 10px 10px 10px 80px;
    background: rgba(255, 255, 255, 90%);
    transition: ease all 0.3s;
    z-index: 2;
}

.frame-textkacheln .row .col- header h2,
.frame-kacheln .row .col- header h2{
    font-size: 20px;
    font-weight: 700;
    margin: 0;
    padding: 0;
}

.frame-kacheln .row .col- header h2 {
    text-align: left;
}

.frame-kacheln .row .col- header::after {
    content: '';
    position: absolute;
    top: -10px;
    bottom: -10px;
    left: 20px;
    right: 0;
    background: url(/fileadmin/cn_website/images/arrow-yellow.png) left center no-repeat;
    background-size: contain;
}

.frame-kacheln .row .col- header::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 100%;
    height: 10px;
    clip-path: polygon(0 100%, 100% 100%, 100% 0);
    background: rgba(255, 255, 255, 90%);
    transition: ease all 0.3s;
}

.frame-kacheln .row .col- .linkoverlay:hover + .frame header::before {
    background: var(--dunkelblau);
}

.frame-textkacheln .row .col- header h2{
    font-weight: 700;
}

.frame-kacheln .row .col- header h2 a{
    color: var(--dunkelblau);
}

.frame-kacheln .row .col- .linkoverlay:hover + .frame header h2 a{
    color: var(--gelb) !important;
}


.frame-kacheln .row .col- header h2::after{
    display: none;
}

.frame-kachelnhf .row .col- {
    width: 23%;
    margin: 0 1% 15px 0;
    float: left;
    position: relative;
    clear: none;
}

.frame-kachelnhf .row .col-:nth-child(even){
    margin-top: 180px;
}

.frame-kachelnhf .row .col-:nth-child(2n+5){
    margin-top: -180px;
}
.frame-kachelnhf .row .col-:nth-child(2n+6){
    margin-top: 0;
}

.frame-kachelnhf .row .col- .ce-textpic{
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.news-single .news-text-wrap,
.news-single .teaser-text,
#inhaltsbereich > .frame-default.frame-type-textmedia header,
#inhaltsbereich > .frame-default.frame-type-textmedia .ce-bodytext,
#inhaltsbereich > .frame-default.tx_cn-multicontent .cn_multicontent_teaser{
    max-width: 800px;
}

#inhaltsbereich > .frame-default.frame-type-textmedia header + .ce-textpic{
    float: left;
    clear: both;
    width: 100%;
}

.news .news-listslider-view .owl-nav button.owl-next,
.news .news-listslider-view .owl-nav button.owl-prev {
    position: absolute;
    right: -70px;
    top: calc(50% - 40px);
    width: 50px;
    height: 81px;
    background: url(/fileadmin/cn_website/images/arrow-blue.png) center center no-repeat !important;
    background-size: contain !important;
    transform: rotate(0deg);
}

.news .news-listslider-view .owl-nav button.owl-prev {
    right: auto;
    left: -70px;
    transform: rotate(180deg);
}

.frame-schmal .ce-bodytext{
    width: 60%;
    margin-left: 20%;
    max-width: 725px;
}

.frame-schmal .tx-powermail{
    max-width: 725px;
}

.ce-bodytext h3,
.ce-bodytext h4,
.ce-bodytext h5{
    margin-bottom: 10px;
}
p + h2,
p + h3,
p + h4,
p + h5{
    margin-top: 30px;
}

.linkoverlay {
    position: absolute;
    display: block;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
    background: rgba(0,0,0,0);
    transition: ease-out all 0.3s ;
}

.frame-kacheln .row .col- .ce-gallery{
    margin: 0;
}

.frame-kacheln .row .col- .ce-gallery .image-embed-item{
    transform: scale(1.0);
    transition: ease-out all 0.3s;
}

.frame-kacheln .row .col- .linkoverlay:hover + .frame header{
    background: var(--dunkelblau);
}

.frame-kacheln .row .col- .linkoverlay:hover + .frame .ce-gallery .image-embed-item{
    transform: scale(1.1);
}

.frame-schraeg {
    position: relative;
    padding: 100px 0;
    background: var(--hellblau);
    color: var(--weiss);
}

.frame-schraeg a,
.frame-schraeg h1,
.frame-schraeg h2,
.frame-schraeg h3,
.frame-schraeg h4 {
    color: var(--weiss);
}

.frame-schraeg::before,
.frame-schraeg::after {
    content: '';
    position: absolute;
    top: -1px;
    left: 0;
    right: 0;
    height: 40px;
    background: var(--weiss);
    clip-path: polygon(0 0, 0% 100%, 100% 0);
    z-index: 1;
}

.frame-schraeg::after {
    top: auto;
    bottom: -1px;
    clip-path: polygon(0 0, 0% 100%, 100% 100%);
}

.frame-schraeg .ce-intext.ce-nowrap .ce-gallery{
    margin-top: 0;
    margin-bottom: 0;
}

.ce-bodytext a.more{
    color: var(--gelb);
    font-size: 24px;
    font-weight: 700;
    padding: 20px 0 20px 40px;
    display: block;
    position: relative;
    margin-top: 20px;
}

.news .news-content a.more {
    font-weight: 700;
    padding: 20px 0 20px 40px;
    width: calc(100% - 40px) !important;
    display: block;
    position: relative;
    margin-top: 20px;
    text-align: left !important;
    text-decoration: none;
    transition: var(--standardtransition);
    color: var(--dunkelblau);
}

.news .news-content a.more:hover{
    text-decoration: underline;
}

.news .news-content a.more::before,
.ce-bodytext a.more::before {
    content: '';
    position: absolute;
    left: 0;
    top: calc(50% - 25px);
    width: 31px;
    height: 50px;
    background: url(/fileadmin/cn_website/images/arrow-yellow.png) center center no-repeat;
    background-size: contain;
}

.frame-schraeg .ce-bodytext a.more {
    color: var(--weiss);
}

.text-right a.more{
    float: right;
}

.frame-textge .row > div{
    position: relative;
    color: var(--gelb);
    padding: 20px 0 40px;
    text-align: center;
}

.frame-textge .row > div:before{
    content: '';
    width: 90%;
    height: 100%;
    background: var(--dunkelblau);
    position: absolute;
    left: 5%;
    top: 0;
    transform: rotate(-9deg);
    z-index: -1;
}

.frame-textge .row > div .ce-bodytext{
    width: 80%;
    padding: 0 10% 60px;
}

.frame-textge .row > div .ce-bodytext a{
    color: var(--gelb);
}

.frame-textge .row > div .ce-bodytext a.more{
    position: absolute;
    bottom: 50px;
    left: calc(50% - 121px);
}

.frame-textge .row > div .ce-bodytext a.more::before{
    width: 90%;
    left: 5%;
    z-index: -1;
    transform: rotate(0);
}

.frame-textge .row > div > div{
    width: 96% !important;
    margin: 0 2% !important;
}


.frame-textge .row.equalize > div > .frame > .rahmen,
.frame-textge .row.equalize > div > .frame > .rahmen .ce-textpic,
.frame-textge .row.equalize > div > .frame > .rahmen .ce-textpic .ce-bodytext{
    height: 100%;
}

/* 
.owl-height{
    opacity: 0;
} */

.news .news-listslider-view.owl-carousel .owl-stage-outer{
    padding-bottom: 5px;
}
.news .news-listslider-view {
    opacity: 0;
}

/*.news .news-listslider-view .article{
     float: left;
    clear: both;
    width: 100%; 
}*/

.news .news-listslider-view .news-list-date {
    display: none;
}

.news .news-listslider-view .article .news-content{
    float: left;
    clear: both;
    width: calc(100% - 40px);
    padding: 15px 20px 25px;
    background: var(--hellgrau);
    color: var(--grau);
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 20px), 0% 100%);
}

.news .news-listslider-view .article .news-img-wrap{
    margin: 0;
    clear: both;
    width: 100%;
}

.news .article .news-img-wrap a{
    margin: 0;
    padding: 0 !important;
    border: none !important;
}

.news-list-date{
    font-size: 18px;
    color: var(--grau);
    text-align: right;
    float: left;
    width: 100%;
    margin: 0 0 15px;
}

.news .news-content h3 a{
    font-size: 20px;
    color: var(--dunkelblau) !important;
    font-weight: 700;
    margin-bottom: 10px;
    float: left;
    clear: both;
    width: 100%;
    min-height: 70px;
    text-decoration: none !important;
}

.news .news-content .news-text{
    line-height: 1.2em;
}

.news .news-content a.more{
    text-align: right;
    float: left;
    clear: both;
    width: 100%;
}

.news .news-list-view  .article .news-img-wrap{
    margin: 0 40px 0 0;
}

.news .news-list-view .article .content{
    float: left;
    clear: none;
    width: calc(100% - 540px);
    margin-top: 75px;
}

.news .news-list-view .article .news-list-date{
    float: left;
    text-align: left;
}

.news .news-list-view .article .morelink{
    float: right;
    margin-top: 20px;
}

.news.news-single .article .news-img-wrap{
    float: left;
    margin: 0;
    width: 100%;
}

.news.news-single .article .news-img-wrap.weitere{
    display: flex;
    flex-wrap: wrap;
}


.news.news-single .article .news-img-wrap .outer{
    float: left;
    width: 32%;
    margin-right: 1%;
    margin-bottom: 10px;
}
.news.news-single .article .news-img-wrap.vorschaubild .outer{
    width: 100%;
}

/* .news.news-single .article .news-img-wrap .outer + .outer{
    margin-left: 20px;
} */

.news.news-single .article .news-img-wrap iframe,
.news.news-single .article .news-img-wrap img{
    height: 400px;
    max-width: 533px;
    /* width: auto; */
}


.news.news-single .article .news-img-wrap.weitere iframe,
.news.news-single .article .news-img-wrap.weitere img{
    max-width: 100%;
    height: auto;
}

.news.news-single .article .news-img-wrap.vorschaubild{
    float: right;
    max-width: calc(40% - 40px);
}

.news.news-single .article .news-img-wrap.vorschaubild img{
    max-width: 100%;
    height: auto;
}

.news.news-single .news-backlink-wrap{
    clear: both;
    margin-top: 20px;
}

.news.news-single .zusatzcontent{
    float: left;
    clear: both;
    width: 100%;
}

.news.news-single .zusatzcontent > div{
    width: 42%;
}

.news .article .teaser-text{
    font-size: 20px;
    color: var(--schwarz);
}

.tx-powermail .powermail_fieldset{
    border: none;
    margin: 0;
    padding: 0;
}

.tx-powermail .powermail_fieldwrap{
    float: left;
    clear: both;
    width: 100%;
    margin: 0 0 20px 0;
}

.tx-powermail input:not(.powermail_submit):not(.powermail_checkbox):not(.powermail_radio),
.tx-powermail textarea{
    width: calc(100% - 44px);
    margin: 0;
    padding: 10px 20px;
    border: 2px solid var(--dunkelblau);
    resize: none;
    -webkit-appearance: none;
    font-family: 'Segoe UI', Tahoma, Verdana, sans-serif;
    font-weight: 400;
    font-size: 20px;
    color: var(--grau);
}

.powermail-errors-list{
    list-style-type: none;
    margin: 0;
    padding: 0;
    color: var(--hellblau);
}

.powermail_submit{
    background: var(--gelb);
    color: var(--dunkelblau);
    border: 2px solid var(--dunkelblau);
    width: auto;
    float: right;
    -webkit-appearance: none;
    font-family: 'Segoe UI', Tahoma, Verdana, sans-serif;
    font-weight: 400;
    font-size: 20px;
    padding: 20px 40px;
    cursor: pointer;
    margin-top: 20px;
    transition: ease-out all 0.3s;
}

.powermail_submit:hover{
    background: var(--dunkelblau);
    color: var(--gelb);
}

blockquote{
    position: relative;
}

blockquote::before{
    content: '"';
    color: var(--hellblau);
    font-size: 100px;
    position: absolute;
    left: -40px;
    top: 20px;
}

.ui-accordion-header{
    background: var(--hellgrau);
    padding: 10px 40px 10px 10px;
    width: calc(100% - 50px);
    font-size: 22px;
    margin: 5px 0;
    position: relative;
    cursor: pointer;
    text-align: left;
    border: none;
}

.ui-accordion-header::after{
    content: '+';
    position: absolute;
    right: 10px;
    top: 3px;
    font-size: 40px;
    transition: var(--standardtransition);
}

.ui-accordion-header.ui-state-active::after{
    transform: rotate(45deg);
}

.ui-accordion-content {
    padding: 10px;
    width: calc(100% - 20px);
}
/* -- Inhaltsbereich -- */

/* -- Footer -- */
#footer{
    float: left;
    clear: both;
    width: 100%;
    margin-top: 100px;
    font-size: 18px;
    line-height: 1.3em;
}

#footer h2{
    font-size: 22px;
    color: var(--dunkelblau);
    padding-left: 20px;
}

#footer h2::after {
    background: var(--hellblau);
    left: 0;
}

/* #footer .owl-stage-outer .owl-item .frame{
    filter: saturate(0);
    transition: ease-out all 0.3s;
}

#footer .owl-stage-outer .owl-item .frame:hover{
    filter: saturate(1);
} */

.frame-slider{
    opacity: 0;
}

.owl-prev,
.owl-next {
    background: url(/fileadmin/cn_website/images/prev.svg) center center/contain no-repeat !important;
    display: block;
    text-indent: -9999px;
    overflow: hidden;
    height: 27px;
    width: 27px;
    float: left;
    position: absolute;
    top: calc(50% - 50px);
    left: -25px;
}

.owl-next {
    transform: rotate(180deg);
    left: unset;
    right: -25px;
}

#header .ce-gallery,
#header .ce-gallery .ce-column,
#header .ce-gallery .ce-column .image,
#header .ce-gallery .ce-column .image img{
    width: 100%;
}

#header .owl-dots {
    position: absolute;
    left: 10%;
    bottom: 40px;
    display: inline-block;
    vertical-align: top;
}

#header .owl-dot {
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 100%;
    background: var(--hellblau);
    margin: 0 2px;
}

#header .owl-dot.active {
    background: #fde304;
}

#footer ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.frame-strich > .rahmen{
    padding: 25px 0;
    border-top: 10px solid var(--hellblau);
}

.to-top/* ::before */ {
    /* content: ''; */
    position: fixed;
    right: 2%;
    bottom: 80px;
    width: 45px;
    height: 45px;
    padding: 5px;
    overflow: hidden;
    text-indent: -999px;
    background: url('/fileadmin/cn_website/images/arrow-blue.png') center center no-repeat,var(--weiss);
    transform: rotate(-90deg);
    background-size: contain;
    cursor: pointer;
    border: none;
    border-radius: 10px;
    z-index: 1;
    transition: var(--standardtransition);
    /* opacity: 0.25; */
    /* box-shadow: 0 0 5px #00000030; */
    border: 1px solid var(--dunkelblau);
}

#footer .frame-strich > .rahmen{
    padding: 25px 0;
    /* border-top: 10px solid var(--hellblau); */
} 

#footer .frame-strich ul{
    text-align: left !important;
}

#footer .frame-strich ul li,
#footer .frame-strich ul li a {
    font-weight: 700;
    color: var(--dunkelblau);
}

#footer .frame-strich a{
    color: var(--grau);
}

#footer .owl-carousel {
    width: calc(100% - 140px);
    margin: 0 70px;
}

#footer .owl-carousel .owl-nav button.owl-next,
#footer .owl-carousel .owl-nav button.owl-prev {
    position: absolute;
    right: -70px;
    top: calc(50% - 40px);
    width: 50px;
    height: 81px;
    background: url(/fileadmin/cn_website/images/arrow-blue.png) center center no-repeat !important;
    background-size: contain !important;
    transform: rotate(0deg);
}

#footer .owl-carousel .owl-nav button.owl-prev {
    right: auto;
    left: -70px;
    transform: rotate(180deg);
}

#footer .frame-strich .row > div:last-child{
    float: right;
    line-height: 1em;
}

#footer .frame-strich .row > div:last-child ul li{
    margin: 0.3em 0;
}

#footer .tx_cn-multicontent:last-child{
    background: var(--hellblau);
    color: var(--weiss);
    padding: 30px 0;
    margin-top: 60px;
    position: relative;
}

#footer .tx_cn-multicontent:last-child::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 99%;
    right: 0;
    height: 60px;
    background: var(--hellblau);
    clip-path: polygon(100% 0, -10% 100%, 100% 100%);
}

#footer .tx_cn-multicontent:last-child a{
    color: var(--weiss);
}

#footer .tx_cn-multicontent:last-child .col-25 .ce-gallery{
    float: right;
    margin: 0;
}

#footer .tx_cn-multicontent:last-child .image picture,
#footer .tx_cn-multicontent:last-child .image figcaption{
    float: left;
    margin: 0 4px;
}

#footer .btn {
    font-size: 12px;
}

#footer .frame-strich .col-50 {
    width: calc(60% - 180px);
}

#footer .frame-strich .col-25 {
    width: calc(40% - 180px);
}

#footer .frame-strich .col-15{
    width: 340px;
    margin-left: 20px;
}

#footer a{
    text-decoration: underline;
    text-decoration-thickness: 1px;
    transition: var(--standardtransition);
    line-height: 24px;
    /* display: inline-block; */
}
#footer a:hover{
    text-decoration-thickness: 3px;
}
/* -- Footer -- */

.sr:not(:focus), .skip-link:not(:focus) {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    clip: rect(0 0 0 0);
    clip-path: inset(100%);
    white-space: nowrap;
}