/* ============================================================
   Nachhaltigkeits- und Klimaplattform Brandenburg 2026-2029
   Overrides Bootstrap Package :root custom properties only.
   Loaded AFTER bootstrap-package merged CSS.
   ============================================================ */
   
/* ============================================================
   Fonts
   ============================================================ */
	@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 400;
	src: url("fonts/OpenSans-Regular.eot"); }
	@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 400;
	src: local("Open Sans"), local("OpenSans"), url("fonts/OpenSans-Regular.eot") format("eot"), url("fonts/OpenSans-Regular.ttf") format("truetype"), url("fonts/OpenSans-Regular.woff") format("woff"); }
	/* bold */
	@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 700;
	src: url("fonts/OpenSans-Bold.eot"); }
	@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 700;
	src: local("Open Sans Bold"), local("OpenSans-Bold"), url("fonts/OpenSans-Bold.eot") format("eot"), url("fonts/OpenSans-Bold.ttf") format("truetype"), url("fonts/OpenSans-Bold.woff") format("woff"); }
	/* normal italic */
	@font-face {
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 400;
	src: url("onts/OpenSans-Italic.eot"); }
	@font-face {
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 400;
	src: local("Open Sans Italic"), local("OpenSans-Italic"), url("fonts/OpenSans-Italic.eot") format("eot"), url("fonts/OpenSans-Italic.ttf") format("truetype"), url("fonts/OpenSans-Italic.woff") format("woff"); }
	/* bold italic */
	@font-face {
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 700;
	src: url("fonts/OpenSans-BoldItalic.eot"); }
	@font-face {
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 700;
	src: local("Open Sans Bold Italic"), local("OpenSans-BoldItalic"), url("fonts/OpenSans-BoldItalic.eot") format("eot"), url("fonts/OpenSans-BoldItalic.ttf") format("truetype"), url("fonts/OpenSans-BoldItalic.woff") format("woff"); }



/* ============================================================
   root Variablen
   ============================================================ */
	:root {
		--white: #ffffff;
		--bb-font: "Source Sans Pro", system-ui, -apple-system, "Segoe UI", sans-serif;
		/* Typography */
		--bs-body-font-family: var(--bb-font);
		--font: #161616;
		--bs-heading-color: var(--font);
		--bs-primary-light: color-mix(in srgb, var(--bs-primary) 50%, transparent);

		--frame-outer-spacing-before: 0.5em !important;
		--frame-outer-spacing-after: 0.5em !important;
		--frame-spacing: 1em !important;
		--frame-outer-spacing-variant-extra-small: 0.4em !important;

		--cardgroup-gap: 2em;

		--bs-border-radius: 0px;
		--bs-border-radius-sm: 0px;
		--bs-border-radius-lg: 0px;
		--bs-border-radius-xl: 0px;
		--bs-border-radius-xxl: 2rem;
		--bs-border-radius-2xl: var(--bs-border-radius-xxl);
		--bs-border-radius-pill: 0px;
	}
/* ============================================================
   Forms
   ============================================================ */
	.form-control,	
	input[type="file"], 
	input[type="text"], 
	input[type="password"],
	textarea.form-control {
		color: var(--font);
		background-color: var(--white) !important;
		border: var(--bs-border-width) solid #999999 !important;
		border-radius: 0px !important;
		box-shadow: none !important;
	}

	.btn {
		--bs-btn-border-radius: 0px;
		font-weight: bold;
		border: var(--bs-border-width) solid var(--white);
		background-image: none;
		box-shadow: none;
	}
	 .btn-white{
		background-color: var(--white);
	 }
	.btn-primary,.btn-secondary,.btn-ertiary,.btn-dark,.btn-darker{
		color: var(--white);
	}
	.form-select {
		border-radius: 0px;
	}
	.form-actions{
		padding-top:.5em;
	}
	.frame-type-form_formframework{
		.form-element{
			background:var(--bs-light);
			margin-bottom: 0px !important;
			padding-left:1rem;
			padding-right:1rem;
			padding-top:1rem;
			&.row{
				background:none;
				padding-right:20px;
				padding-left:20px;
				padding-top:0rem;
				.col-6, .col-4, .col-3{
					background:var(--bs-light);
					padding-right:0;
					padding-left:0;
					padding-top:0;
				}
			}

		}
		.form-actions{
			background:var(--bs-light);
			margin-top:0px;
			padding-left:1rem;
			padding-right:1rem;
			padding-bottom:1em;
			text-align: right;
		}
		.form-element.form-element-statictext {
			background:var(--white);
			padding:0px;
		}
	}
	.frame-type-felogin_login{
		form{
			input[type="submit"]{
				float:right;
			}
		}
	}
	.form-element-check{
		.form-check-wrapping-label{
			.form-check-input{
				position:absolute;
			}
			.form-check-label{
				padding-left: 2em;
			}
		}
		.form-text{
			padding-left: 2em;
		}
	}

/* ============================================================
   allgemeine Angaben ´
   ============================================================ */
	body {
		font-family: Open Sans, Helvetica, Arial;
		font-style: normal;
		font-weight: normal;
		font-size: 1rem;
		color: #161616;
		text-rendering: optimizeLegibility;
		line-height: 1.69;
		position: relative;
		-webkit-font-smoothing: antialiased; 
	}

	.body-bg{ 
		margin:0 auto;	
		max-width: 1320px;
		background-color: var(--white);
		-webkit-box-shadow: 0px 0px 42px -42px #000000;
	}

	main a{text-decoration: underline;}
	main a.more,
	.frame-type-menu_subpages a{text-decoration: none;}

	.page-9 .section-column.subcontent-wrap .frame:first-child{
		margin-top :0px !important;
		padding-top: 0px !important;
	}
	.container-fluid.ontodigital-2col-33-67{
		padding-right: 0px;
		padding-left: 0px;
		border-bottom:1px solid var(--bs-light);
	}

	@layer base, components;
	@layer components {

		:is(main, .frame) {

			a:is(
			[href^="http"]:not([href*="p-zzl077.project.space"]),
			[href^="https"]:not([href*="p-zzl077.project.space"]),
			[target="_blank"]
			) {
				display: inline;

				&::after {
					content: "";
					display: inline-block;

					width: 1.5cap;
					height: 1.5cap;

					margin-inline-start: 0.35rem;
					vertical-align: middle;
					position: relative;
					top: -0.1em;

					background-color: currentColor;
					mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3Cpath d='M536.2,128.7c0-13.7-11.2-24.9-24.9-24.9h-160c-13.7,0-24.9,11.2-24.9,24.9s11.2,24.9,24.9,24.9h99.8l-213.5,213.5c-4.7,4.7-7.3,11-7.3,17.6s2.6,12.9,7.3,17.6c9.7,9.7,25.6,9.7,35.3,0l213.5-213.5v99.8c0,13.7,11.2,24.9,24.9,24.9s24.9-11.2,24.9-24.9v-160Z'/%3E%3Cpath d='M472.9,416c0-13.7-11.2-24.9-24.9-24.9s-24.9,11.2-24.9,24.9v80c0,12.7-10.4,23.1-23.1,23.1H144c-12.7,0-23.1-10.4-23.1-23.1V240c0-12.7,10.4-23.1,23.1-23.1h80c13.7,0,24.9-11.2,24.9-24.9s-11.2-24.9-24.9-24.9h-80c-40.2,0-72.9,32.7-72.9,72.9v256c0,40.2,32.7,72.9,72.9,72.9h256c40.2,0,72.9-32.7,72.9-72.9v-80Z'/%3E%3C/svg%3E");
					mask-size: contain;
					mask-repeat: no-repeat;
					mask-position: center;
				}
			}
		}
	}
	.page-1 breadcrumb-section,
	.page-9 breadcrumb-section{
		display:none;
	}
/* ============================================================
   Frames
   ============================================================ */
	.frame-	.frame-space-before-none,
	.frame-space-after-none{
		margin-top: var(--frame-outer-spacing-before);
		margin-bottom: var(--frame-outer-spacing-after);
		padding-top: var(--frame-spacing);
		padding-bottom: var(--frame-spacing);
	}

	.frame-space-before-extra-small{
		padding-top: var(--frame-outer-spacing-variant-extra-small) !important;
	}
	.frame-space-after-extra-small{
		padding-bottom: var(--frame-outer-spacing-variant-extra-small) !important;
	}layout-embedded > .frame-group-container > .frame-group-inner {
		border-radius: 0px !important;
		.frame-inner{
			padding-left:1rem;
		}
	}
	.frame-background-none .frame-group-inner,
	.frame-no-backgroundimage .frame-group-inner{
		padding-left:0px !important;
	}
	.frame-background-primary,.frame-background-secondary,.frame-background-tertiary,.frame-background-dark,.frame-background-darker{
		h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
			color: var(--white);
		}
	}

	@media (min-width: 576px) {
		.frame-layout-embedded > .frame-group-container {
			max-width: 100%;
		}
	}
	@media (min-width: 992px) {
		.frame-layout-embedded > .frame-group-container {
			max-width: 100%;
		}
	}
	@media (min-width: 1200px) {
		.frame-layout-embedded > .frame-group-container {
						max-width: 100%;
		}
	}
	#p63 .frame-type-textpic{
		.textpic-item.textpic-gallery{
			border:1px solid var(--bs-light);
			position:relative;
			&:after{
				content:"";
				position:absolute;
				top:0px;
				right:0px;
				left:0px;
				bottom:0px;
				background: linear-gradient(
					135deg,
					oklch(85% 0 0),
					oklch(85% 0 0 / 0)
				);
				opacity:0.3;
			}
		} 
	}



/* ============================================================
   Text-Media
   ============================================================ */

	@media (min-width: 768px) {
		.textmedia-right .textmedia-item.textmedia-text, 
		.textmedia-right .textpic-item.textmedia-text,  
		.textmedia-left .textmedia-item.textmedia-text, 
		.textmedia-left .textpic-item.textmedia-text, 
		.textpic-right .textmedia-item.textmedia-text, 
		.textpic-right .textpic-item.textmedia-text, 
		.textpic-left .textmedia-item.textmedia-text, 
		.textpic-left .textpic-item.textmedia-text {
			width: calc(70% - (40px / 2));
		}
		.textmedia-right .textmedia-item.textmedia-gallery, 
		.textmedia-right .textpic-item.textmedia-gallery, 
		.textmedia-left .textmedia-item.textmedia-gallery, 
		.textmedia-left .textpic-item.textmedia-gallery, 
		.textpic-right .textmedia-item .textmedia-gallery, 
		.textpic-right .textpic-item .textmedia-gallery, 
		.textpic-left .textmedia-item.textmedia-gallery, 
		.textpic-left .textpic-item.textmedia-gallery{
			width: calc(30% - (40px / 2));
		}
	}
/* ============================================================
   Header 
   ============================================================ */
	#page-header{
	 	position: sticky;
		top:0px;
		z-index:300;
		padding-bottom: 0px;
		padding-left:20px;
		padding-right:20px;
		&::before{
			content: "Nachhaltigkeits- und Klimaplattform Brandenburg";
			background-color: var(--bs-primary);
			color: #fff;
			font-size: 15px;
			line-height: 1.2;
			width: 100%;
			margin: 0 auto;
			padding: 7px 30px;
			position: absolute;
			top: 0px;
			left:0px;
		}
		.container-mainnavigation{
			height: 150px;
			display: block;
			padding:0px;
			padding-bottom:31px;
			padding-top:1em;
			.navbar-brand {
				display:block;
				margin-right:31px;
				width:110px;
				height:87px;
				img{
					width:100%;
					height:100%;
					object-fit: contain;
					max-height: 100%;
					max-width: 100%;
				}
			}

			#mainnavigation{
				.navbar-nav{
					display: flex;
					justify-content: flex-end;
					flex-direction: row;
					.nav-item {
						display: flex;
						flex-wrap: wrap;
						align-content: flex-start;
						a{
							color:var(--font);
							&::before{
								content:"";
								display:none;
							}
							&.active{
								color:var(--bs-primary);
							}
						}
					
						.dropdown-menu {
							border:none;
							border-top:3px solid var(--bs-primary);
							border-radius:0px;
							background-color: var(--white);
							margin-top: 1px;
						}
					}
					.nav-item:last-child .dropdown-menu.dropdown-menu-simple.show{
						right: 0px;
  						left: auto;
					}
				}
			}
			.navbar-toggler {
				position: absolute;
				right: 0;
				top: 2em;
				height: 50px;
				width: 70px;
				.navbar-toggler-icon,
				.navbar-toggler-icon:before,
				.navbar-toggler-icon:after{
					height: 3px;
					width: 30px;
					border-radius: 2px;
				}
				.navbar-toggler-icon {
					height: 0;
				}
				&.collapsed{
					.navbar-toggler-icon,
					.navbar-toggler-icon:before,
					.navbar-toggler-icon:after{
						height: 3px;
						width: 30px;
						border-radius: 2px;
					}
				}
			}
		}
	}

	.breadcrumb-section{
		padding: 0px;
		padding-top: 1em;
		padding-bottom: 0.5em;
		background-color: transparent;
		.breadcrumb {
			background-color: transparent;
			padding: 0px;
			margin: 0px;
			.breadcrumb-item {
				font-size: 0.875rem;
				a {
					color: var(--bs-primary);
					text-decoration: none;
					&:hover,
					&:focus,
					&:active {
						text-decoration: underline;
					}
				}
			}
			.breadcrumb-item + .breadcrumb-item::before {
				content: var(--bs-breadcrumb-divider,"▸");
			}
		}
	}
	.page-1 .breadcrumb-section,
	.page-9 .breadcrumb-section{
		display:none !important;
	}

	@media (max-width: 991px) {
		#page-header{
			#mainnavigation{
				display: none !important;
				width: 100vw;
				height: 100%;
				position: fixed;
				z-index: 500;
				right: 0px;
				top: 151px;
				box-shadow: 1px 1px 30px rgba(0,0,0,.06);
				background-color: oklch(0% 0 0 / 0.4);
				transition: opacity .2s ease-in;
				&.show{
					display: block !important;
					.navbar-nav{
						position: fixed;
						right: 0px;
						display: block !important;
						width: 320px;
						background:var(--white) ;
						height: calc(100dvh - 151px);    
						overflow-x: hidden;
						overflow-y: auto;
						overscroll-behavior: contain;  
						.nav-item {
							display: block !important;
							width: 320px;
							font-size: 105%;
							a{
								padding:0.5em;
								padding-left:1em;
								padding-right:1em;
								box-sizing: border-box;
								width:calc(100% - 50px);
								display: inline-block;
								&:before{
									content: "";
									display:none;
								}
							}

							&:hover,
							&:focus,
							&:active{
								background-color: var(--bs-lighter);
								color:var(--bs-primary);
							}
							a.active{
								&:before{
									content: "";
									display:none;
								}
								color:var(--bs-primary);
								font-weight:bold;
							}
							button.nav-link {
								display: inline-block;
								.nav-link-indicator::before {
									content: "";
									border-top: 3px solid currentColor;
									border-left: 3px solid currentColor;
								}
							}

							.dropdown-menu{
								position:relative;
								width: 320px;
								box-shadow: none;
								padding:0px;
								background-color: var(--bs-lighter);
								.nav-item{
									padding-left:0.5em;
									border-bottom: 1px solid var(--white);
								}
							}
						}
					}
				}
			}
		}
	}


/* ============================================================
   Footer Section
   ============================================================ */
	.footer-section-content {
		background: var(--bs-light); 
		--frame-color: #ffffff;
		--frame-background:var(--bs-light); 
		--frame-link-color: var(--bs-link-color); 
		--frame-link-hover-color:  var(--bs-link-color); 
		.frame{
			border: none;
			border-radius: 0px;
			padding: 1.5rem;
			.frame-header {
				margin-bottom: 1rem;
				background-color: transparent;
				padding: 0px;
				h2,h3,h4,h5,h6{
					font-weight: normal;
					font-style: italic;
					color: var(--font) !important;
				}
			}	
			.frame-body {
				padding: 0px;
			}
			ul{
				padding:0px;
				background-color: transparent;
				li{
					border-top:1px solid var(--font);
					padding-top:0.5em;
					padding-bottom:0.5em;
					background:transparent;
					list-style: none;
					a{
						text-decoration:none;
						color: var(--font);
						&::before{
							content:"";
							display:none !important;
						}
					}
				}
			}
			ul.list-normal{
				li::before {
					content: "";
					color: var(--bs-primary);
					font-size: 1.1em;
					position: absolute;
					left: -16px;
				}
			}

		}
		
	}
	.footer-section-meta{
		background-color: var(--bs-primary);
		padding-top:4px;
		.frame{
			padding:0px;
			margin:0px;
		}
		.footer-menu-section {
			display:flex;
			flex-direction: row;
			justify-content: space-between;
			font-size: 15px;
			line-height: 1.2;
			&::before{
				content:"Nachhaltigkeits- und Klimaplattform Brandenburg";
				display:flex;
			}
			.footer-navigation-list {
				display: flex;
				justify-content: flex-end;
				flex-direction: row;
				.footer-navigation-item  {
					display: flex;
					flex-wrap: wrap;
					align-content: flex-start;
					a{font-weight:400;}
					
				}
			}
		}
		.footer-info-section{
			display:none;
		}
	}

	.scroll-top {
		--scrolltop-bg: var(--bs-primary);
		--scrolltop-color: var(--white);
		--scrolltop-hover-bg: var(--bs-primary);
		--scrolltop-hover-color: var(--white);
		background-color: var(--scrolltop-bg);
		border-radius: 0px;
	}

	@media (max-width: 991px) {
		.footer-section-meta{
			.footer-menu-section {
				display:flex;
				flex-direction: column;
				flex-wrap: wrap;
				justify-content: space-between;
				&::before{
					content:"Nachhaltigkeits- und Klimaplattform Brandenburg 2026-2029";
					display:flex;
					margin-bottom:10px;
				}
				.footer-navigation-list {
					display: block;

					.footer-navigation-item  {
						display: inline-block;
						margin-bottom:0px;
						padding-bottom:0px;
						margin-right:10px;
					}
				}
			}
		}
	}

/* ============================================================
   Typhografie
   ============================================================ */
	h1 {
		font-size: 2.03rem;
	}

	h2, .orbit-container figcaption h2 a {
	font-size: 1.688rem;
	}

	h3 {
	font-size: 1.375rem;
	}
	h4 {
	font-style: italic;
	font-weight: bold;
	font-size: 1rem;
	}

	h5 {
	font-style: normal;
	font-weight: bold;
	font-size: 1rem;
	}

	h6 {
	font-style: italic;
	font-weight: normal;
	font-size: 1rem;
	}

	p {
	font-style: normal;
	font-weight: normal;
	font-size: 1rem;
	hyphens: auto;
	-ms-hyphens: auto;
	}
	a{
		text-decoration: none;
	}
	a:hover,
	a:focus,
	a:active {
		text-decoration: underline;
	}
	ul.list-normal {
		padding-left: 16px;
		list-style: none; /* Standard-Aufzählungszeichen entfernen */
	}
 	ul.list-normal li{
		position:relative;
	}
	ul.list-normal li::before {
		content: "▸"; 
		color: var(--bs-primary);
		font-size: 1.1em; 
		position:absolute;
		left: -16px;
	}
/* ============================================================
   Suche
   ============================================================ */
	.frame-type-indexedsearch_pi2{
		padding:0px !important;;
		margin:0px;

	}
		.tx-indexedsearch-searchbox{
			legend{
				display:none;
			}
			display:flex;
			flex-wrap: wrap;
			flex-direction: row;
			justify-content: flex-end;

			.tx-indexedsearch-search-submit,
			.tx-indexedsearch-form{
				display:inline-block;
				width:auto;
				input{
					height:35px;
					padding:3px;
				}
				padding:0px;
				margin-right:0px;
			}
			.tx-indexedsearch-search-submit{
				input{
					padding:0px 1.5em;
					background-color: var(--bs-primary);
					border-radius:0px;
					border:none;
					box-shadow:none;
					color: var(--white);
					&:hover,
					&:focus,
					&:active {
						background-color: var(--bs-primary);
						border-color: transparent;
						color: var(--white);
					}
				}
			}
			p{
				display:none;
			}
		}

	
	.breadcrumb-section{
		.container{
			display:flex;
			flex-wrap: wrap;
			flex-direction: row;
			justify-content: space-between;
			.breadcrumb{
				max-width: calc(100% - 360px) !important;
			}
		}
	}	
	@media (max-width: 576px) {
		.breadcrumb-section{
			.container{
				display:flex;
				flex-wrap: wrap;
				flex-direction: column;
				justify-content: flex-start;
				.breadcrumb{
					max-width: 100%!important;
				}

				.tx-indexedsearch-searchbox{
					display:block;
				}
				
			}
		}	
	}
/* ==============================
   Suchergebnisse
   ============================================ */
   .frame-type-indexedsearch_pi2{
		.tx-indexedsearch-info-sword{
			padding-bottom:1em;
			margin-bottom:0.5em;
			border-bottom: 1px solid var(--bs-light);
			font-size: 2.03rem;
			.tx-indexedsearch-info-sword-word{
				font-weight:600;
			}
		}
		div.tx-indexedsearch-browsebox{
			border-bottom: 1px solid var(--bs-light);
			margin-top: 1em;
			margin-bottom: 1em;			
			padding-left: 0;
			padding-top:0.5em;
			padding-bottom:0.5em;
  			list-style: none;
		}
		div.tx-indexedsearch-browsebox:last-child{
			border:none;
		}
		ul.tx-indexedsearch-browsebox{
			display: flex;
        	justify-content: flex-start;
        	flex-direction: row;
			margin-bottom: 0px;
    		padding-left: 0px;
			li{
				display: flex;
          		flex-wrap: wrap;
          		align-content: flex-start;
				a{}
			}
		}
		.tx-indexedsearch-res{
			border-bottom: 1px solid var(--bs-light);
			padding-top: 2em;		
			margin-bottom: 1em;		
			h3{
				.tx-indexedsearch-percent{
					background: #999999;
					color: #fff;
					margin-left: 0.5em;
					display: inline-block;
					line-height: 1;
					font-size: 70%;
					padding: 4px;
					padding-top: 4px;
					border-radius: 4px;
					font-weight: bold;
        			padding-top: 2px;
				}
			}
			dl.tx-indexedsearch-info{
				display: flex;
        		justify-content: flex-start;
        		flex-direction: row;
				margin-bottom: 0;
				color: #999999;
				flex-wrap: wrap;
				dd{
					margin-right:0.5em;
					&:after{
						content:"|";
						padding-left:0.5em;
					}
				}
				dd:last-child{
					&:after{
						content:"";
						padding-left:0;
					}
				}
			}
		}
   }


/* ============================================================
   News
   ============================================================ */
   .news{
		.article-compact{
			border-bottom:1px solid var(--bs-light);
			padding-bottom:1em;
			.news-header{
				margin-bottom:0.5em;
				font-style:italic;
				.article-compact-date{
					color:var(--bs-primary);
				}
				.article-compact-title a{
					text-decoration:underline;
				}
			}
			.article-compact-teaser{
				display: flex;
				align-items: center;
				min-height: 100%;
				p{
					display:block; 
				}
				.article-compact-more{
					padding-left:5px;
				}
			}
		}
		.article-hero{
			.news-header{
				padding-top:1em;
				margin-bottom:0.5em;
				.article-hero-date{
					color:var(--bs-primary);
					font-weight:bold;
				}
				.article-hero-title{
					text-decoration:underline;
					padding-bottom:0em;
					margin-bottom:0px;
				}
			}
			.article-hero-teaser{
				p{
					display:inline; 
				}
				.article-hero-more{
					display:inline;
					padding-left:5px;
				}
			}
		}
		.btn-icon svg {
			vertical-align: middle;
			display: inline-block;
			height: 16px;
			width: 16px;
		}
   }
   .news .article:last-child{
		border:none;
   }
   .frame-type-news_newsliststicky{
		.news-list-view.ontodigital-news{
			.articletype-0{
				border-top: 1px solid var(--bs-dark);
				padding-top:1em;
				.header{
					font-style:italic;
					.news-list-date{
						color:var(--bs-primary);
						font-weight:bold;
					}
					h3{
						font-size: 1rem;
						display:inline;
						text-decoration:underline;
						&:before{
							content:" | ";
						}
					}
				}
			}
			.content{
				display:flex;
				flex-wrap: wrap;
				flex-direction: row;
				justify-content: space-between;
				margin-top:10px;
				.news-img-wrap{
					width:150px;
					float:none;
					background:none;
					a{
						display: block;
						float: none;
						border: none;
						background:none;
					}
					img{
						width:150px;
						height: auto;
						object-fit: cover;
						float:none;
					}
					}
					.teaser-text{
						width: calc(100% - 170px);
						display: table-cell;
						vertical-align: middle;
						align-content: center;
					}
				}
				.footer{
					display:none;
				}
			}
		
	}

	@media (max-width: 576px) {
		.frame-type-news_newsliststicky{
			.news-list-view.ontodigital-news{
				.content{
					display:flex;
					flex-wrap: wrap;
					flex-direction: column;
					.news-img-wrap{
						width: 100%;
						text-align:center;
						.no-media-element{
							width:100%;
							height:auto;
							display:block;
						}
					}
					.teaser-text{
						width: 100%;
					}
				}
			}
		}
	}
	.frame-type-news_newsdetail{
		.news.news-single{
			.footer{
				color: var(--bs-primary);
				font-style:italic;
				display:inline;
				border-top: none;;
				p{
					display:inline;
					span {
						display: inline-block;
						padding-right: 0;
						margin-right: 0;
						border-right: none;
						font-style:italic;
						font-weight:bold;
					}
				}

				&:after{
					content:" | "; 
				}
			}
			.teaser-text{
				color: var(--bs-body-color);
				font-style:italic;
				display:inline;
				p{
					
					font-style:italic;
				}
				p:first-child{
					display:inline;
				}
			}
			.news-img-wrap{
				margin-top:1rem;
				 a {
					padding: 0px;
					border: none;
					background: none;
				 }
			}
			.news-text-wrap{
				margin-top:1rem;
				width: calc(100% - 300px);
			}
		}
	}
	@media (max-width: 768px) {
			.frame-type-news_newsdetail{
				.news.news-single{
					.news-img-wrap{
						width:200px;
						img{
							width:100%;
							height:auto;
						}
					}
					.news-text-wrap{
						width: calc(100% - 220px);
					}
				}
			}
		}
		@media (max-width: 576px) {
			.frame-type-news_newsdetail{
				.news.news-single{

					.news-img-wrap{
						display: block;
        				margin-bottom: 1rem;
						width:100%;
						div, a{
							display: block;
							width:100%;
						}
					}
					.news-text-wrap{
						margin-top:1rem;
						float:none;
						width:100%;
					}
				}
			}
		}
/* ============================================================
   Lists und Tables
   ============================================================ */
   ul.list{
		li{
			list-style: none;
			&:before {
				content: "▸";
				padding-right: 0.8rem;
				position: relative;
				bottom: 0.12rem;
				color: var(--bs-primary);
			}		
		}
	}

   	.table, table {
		--bs-table-border-color: var(--bs-border-color);
		border-color: var(--bs-table-border-color);
		background:transparent;
		width:100%;

		th{
			color:var(--bs-primary);
		}
		tr:nth-child(odd) { background: var(--white);}
		tr:nth-child(even) { background: var(--bs-lighter); }
	}
	.table > :not(caption) > * > * {
		background-color: transparent;
	}
/* ============================================================
   Panels Listgroups
   ============================================================ */
	.frame-type-panel{
		.card-panel{
			border-radius:0px;
			.card-header{
				border-radius:0px;
			}
		}
	}
	.frame-type-listgroup{
		.list-group{
			border-radius:0px;
		}
	}

/* ============================================================
   Kasten Subpages
   ============================================================ */
	.frame-type-menu_subpages{
		.frame-header{ 
			background-color:var(--bs-primary); 
			color: var(--white); 
			font-weight: bold; 
			font-style:italic;
			padding:0.5em;
			padding-left:1em;
			padding-right:1em;
			margin-bottom:0px;
			h2,h3,h4,h5,h6{
				font-weight: normal;
				font-style: italic;
				color: var(--white) !important;
			}
		}
		ul{
			background-color:var(--bs-lighter); 
			padding:1em;
			li{
				list-style: none;
				a{
					&:before {
						content: "▸";
						padding-right: 0.8rem;
						position: relative;
						bottom: 0.12rem;
					}
				}		
			}
		}
	}
/* ============================================================
   Carousel
   ============================================================ */
    .frame-type-carousel_small,
	.frame-type-carousel{
		.carousel-item-type-header{
			.carousel-text-inner{
				margin-left:10%; 

				.carousel-text-inner {
				display: block;
				}

				.carousel-header,
				.carousel-subheader {
					font-weight: 500;
					color: oklch(100% 0 0);
					display: inline;

					background-color: oklch(0% 0 0 / 0.6);
					padding: 0.1em 0.3em;
					box-decoration-break: clone;
					-webkit-box-decoration-break: clone;
				}
				.carousel-header{
					font-size: clamp(1.2rem, 1.5vw + 1.5vmin, 3rem);
					line-height: 1.58;
				}
				.carousel-subheader {
					font-size: clamp(1rem, 1.2vw, 1.2rem);
					line-height:3;
				}
			}
		} 
	}
	.carousel .carousel-indicators button {
		border-radius: 50%;
		width: 10px;
		height:10px;
	}
	.carousel .carousel-content-link:focus-visible{
		outline: 2px solid var(--bs-primary);
		outline-offset: 2px;
	}


/* ============================================================
   Cardgroup
   siehe auch unter custom.js applyCardBackgroundClasses
   ============================================================ */
	.frame-type-card_group {
		.card{
			border: none;
			border-radius: 0px;
		}
		&.frame-background-none {
			.card {
				--bs-card-spacer-x: 0;
				background: transparent;
				.card-footer {
					padding: 0rem;
				}
			}
		}

		&.card-has-background {
			color: transparent;
			background: transparent;
			.card {
				--bs-card-spacer-x: 1.5rem;
			}
		}
		.card-img-top {
			border-top-left-radius: 0px;
			border-top-right-radius: 0px;
		}
		.card-body{
			padding-bottom:0.2em;
		}
		.btn.btn-default{
			padding:0px;
			background-color: transparent;
			border:none;
			box-shadow: none;
			border-color: transparent;

			color: var(--bs-primary) !important;
			&:hover,
			&:focus,
			&:active {
				background-color: transparent;
				border-color: transparent;
			}
			.btn-icon svg {
				vertical-align: middle;
				display: inline-block;
				height: 1em;
				width: 1em;
			}
		}
	}
	.card-group-element-item {
		width: calc((100% / var(--cardgroup-columns)) - (var(--cardgroup-gap) * (var(--cardgroup-columns) - 1)) / var(--cardgroup-columns));
	}

/* ==============================
   Akkordion
   ============================================ */
	.frame-type-accordion{
		.accordion{
			background-color: var(--white) !important;
			.accordion-item {
				border-radius:0px !important;
				background-color: var(--white) !important;
				.accordion-header{
					.accordion-button {
						border-radius:0px !important;
						font-weight:bold;
						border-bottom: 1px solid transparent;
						border-top:none;
						background-color: var(--white) ;
						&:before {
							margin-left: 0px;
							margin-right: 10px;
							content: "▸";
							background-image: none;
							width: 20px;
							height: 20px;
						}
						&:after {
							content: "";
							display:none;
						}
					}
					.accordion-button:not(.collapsed) {
						border-bottom: 1px solid var(--bs-border-color);
						border-top:3px solid var(--bs-primary);
						color: var(--bs-accordion-active-color);
						background-color: var(--white) ;
						box-shadow: none;
						&:before {
							content: "▾";
						}
					}
				}
			}
		}
	}
/* ============================================
   time-line
   ============================================ */
   .frame-type-timeline {
		--timeline-item-border: 1px solid var(--bs-light);
		.timeline-item-inner {
			border: 1px solid var(--bs-border-color);
		}
   }
/* ============================================
   frame-type-uploads 
   ============================================ */
	.frame-type-uploads {
		.filelink-list{
			width:100%;
				display:flex;
				flex-direction: row;
				flex-wrap: wrap;
				justify-content: flex-start;
			.filelink-item{
				width:30%;
				margin-top: 0rem;
				margin-bottom: 1rem;
			}
		}
	}
	@media (max-width: 768px) {
		.frame-type-uploads {
			.filelink-list{
				.filelink-item{
					width:50%;
				}
			}
		}
	}
	@media (max-width: 576px) {
		.frame-type-uploads {
			.filelink-list{
				.filelink-item{
					width:100%;
				}
			}
		}
	}
/* ============================================
   Login
   ============================================ */
	.frame-type-felogin_login {
		form{
			background-color: var(--bs-light);
			padding: 1em;
			border-radius:0px;
			input[type="submit"]{
				--bs-btn-border-radius: 0px;
				font-weight: bold;
				border: var(--bs-border-width) solid var(--white);
				background-image:none;
			}
		}
	}
/* ============================================
   ontodigitalsitepackage
   ============================================ */
	.frame-type-ontodigitalsitepackage_initiativenliste {
		.mitglieder{
			form{
				background-color: var(--bs-light);
				padding: 1em;
				padding-bottom:2em;
			}
			.view-toggle-buttons{
				.btn.active {
					background-color: var(--bs-primary);
					color:var(--white);

				}
			}
			.card{
				border-radius:0px; 
				.card-footer{
					/*display: inline-flex;
					flex-wrap: wrap;
					justify-content: space-between;*/
					span.badge{
						text-align: center;
						white-space: normal;
						background-image: none;
						display: inline-block;
						margin-bottom:10px;
						hyphens: none;
          				-ms-hyphens: none;
						vertical-align:middle;
						line-height: 1.2;
					}
				}
			}
		}
	}
/* ============================================
   cookieconsent
   ============================================ */	
   #cookieconsent{
	.cc-container{
		.cc-header{
			color:#ffffff;
		}
		.cc-compliance{
			.cc-btn {
				background-color:#ffffff;
				color: var(--bs-primary);
				font-weight:bold;
				border:2px solid #ffffff;
				&:focus, &:hover, &:active{
						background-color: var(--bs-primary);
						color:var(--white);
						border:2px solid #ffffff;
				}

			}
		}
	}
	button.cc-btn:focus-visible{
		outline: 2px solid #ffffff;
		outline-offset: 2px;
	}
	.cc-window.cc-bottom:focus-visible{
		outline: 2px solid var(--bs-primary);
		outline-offset: 2px;
	}
	@media (max-width: 600px) {
		.cc-container{
			display:block;
		}
	}
	@media (max-width:768px) {
		.cc-container {
			max-width: 90%;
		}
	}
/* ============================================
   Mediaqueries
   ============================================ */
	@media (min-width: 300px) {
		.container, .container-sm, .container-md, .container-lg, .container-xl,
		.frame-container-default {
				max-width: 100%;
		}
		#page-header{
			.container-mainnavigation {
					padding: 0px;
					padding-bottom: 0px;
					padding-top: 3em;
			}
		}
	}
   @media (min-width: 576px) {
		.container, .container-sm, .container-md, .container-lg, .container-xl,
		.frame-container-default {
			max-width: 100%;
		}
		#page-header{
			.container-mainnavigation {
					padding-top: 2em;
			}
		}
	}
	@media (min-width: 768px) {
		.container, .container-sm, .container-md, .container-lg, .container-xl,
		.frame-container-default {
			max-width: 100%;
		}
		#page-header{
			.container-mainnavigation {
					padding-top: 2em;
			}
		}
	}
	@media (min-width: 992px) {
		.container, .container-sm, .container-md, .container-lg, .container-xl,
		.frame-container-default {
			max-width: 100%;
		}
		#page-header{
			.container-mainnavigation{
				padding-bottom:31px;
				padding-top:1em;
			}
		}
	}
	@media (min-width: 1200px) {
		.container, .container-sm, .container-md, .container-lg, .container-xl,
		frame-container-default {
			max-width: 100%;
		}
	}