/* Variables */
/* Font */
@font-face {
    font-family: 'CeraPro-Light';
    src: url('../fonts/CeraPro-Light.eot');
    src: url('../fonts/CeraPro-Light.eot?#iefix') format('embedded-opentype'),
         url('../fonts/CeraPro-Light.woff') format('woff'),
		 url('../fonts/CeraPro-Light.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'CeraPro-Regular';
    src: url('../fonts/CeraPro-Regular.eot');
    src: url('../fonts/CeraPro-Regular.eot?#iefix') format('embedded-opentype'),
         url('../fonts/CeraPro-Regular.woff') format('woff'),
         url('../fonts/CeraPro-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'CeraPro-Bold';
    src: url('../fonts/CeraPro-Bold.eot');
    src: url('../fonts/CeraPro-Bold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/CeraPro-Bold.woff') format('woff'),
         url('../fonts/CeraPro-Bold.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'CeraPro-RegularItalic';
    src: url('../fonts/CeraPro-RegularItalic.eot');
    src: url('../fonts/CeraPro-RegularItalic.eot?#iefix') format('embedded-opentype'),
         url('../fonts/CeraPro-RegularItalic.woff') format('woff'),
         url('../fonts/CeraPro-RegularItalic.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

/* Symbole */

@font-face {
    font-family: 'amatiksymbols';
    src: url('../fonts/amatiksymbols.eot');
    src: url('../fonts/amatiksymbols.eot?#iefix') format('embedded-opentype'),
         url('../fonts/amatiksymbols.woff') format('woff'),
         url('../fonts/amatiksymbols.svg#amatiksymbols') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'social';
    src: url('../fonts/social.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* Basic Styles */

/* html {
  scroll-behavior: smooth;
  scroll-padding-top: var(--mainmargin);
}

*/

:root {
	font-size: 1rem;	
	--font-menu: 1.125rem;
	--font-menu-sub: 0.875rem;
	--font-h1: 5rem;
	--font-h2: 3rem;
	--font-h2-big: 3.75rem;
    --font-h2-small: 1.375rem;	
	--font-h3: 1.75rem;
	--font-btn: 0.875rem;	
	--font-dach: 1rem;
	--font-dach-small: 0.875rem;
	--font-p-big: 1.5rem;
	--font-p: 1.5rem;
	--font-slogan: 2.5rem;
	--font-p-small: 1rem;	
	--font-small: 1.125rem;
	
	--clr-blue: #00338d;
	--clr-white: #FFFFFF;  
	--clr-red: #e83e33;
    --clr-yellow: #fecb00;  	

	--padder: 3rem;
	--letter-spacer: 0.025em;
    --bs-gutter-x: 3rem;
}

.skip {
	display: none;
}

:focus-visible {
	outline: 2px solid var(--3rdclr);
	border-radius: 0 !important;
	opacity: 1;
}

.modal:focus-visible {
	outline: 0px solid var(--3rdclr);
	border-radius: 0 !important;
	opacity: 1;
}

@media (max-width: 1280px){
:root {
    --padder: 2rem;
	--bs-gutter-x: 2rem;
	--font-h2: 2.5rem;
	--font-h2-big: 3rem;
	--font-h2-small: 1.25rem;
	--font-p: 1.25rem;
}
}

@media (max-width: 1024px){
:root {
	
	
	
}
}

@media (max-width: 810px){
:root {
	--font-h1: 3.75rem;
	--font-h2: 1.75rem;
	--font-h3: 1.35rem;
	--font-p-big: 1.5rem;
	--font-p: 1.25rem;

	--marger-btm: 15%;
	--diagpad: 2rem;
}
}

@media (max-width: 600px){
:root {
	--font-h1: 2.1875rem;
	--font-h2-big: 2.1875rem;
	--font-h2: 1.75rem;
	--font-h2-small: 1rem;
	--font-h3: 1.35rem;
	--font-p-big: 1.25rem;
	--font-p: 1.15rem;

	--marger-btm: 15%;
	--diagpad: 2rem;
}
}


@media (max-width: 480px){
:root {
	--font-h1: 1.825rem;
	--font-h2: 1.5rem;
	--font-h3: 1.25rem;
	--font-dach: 0.85rem;
	--font-h4: 0.875rem;
	--font-p-big: 1.15rem;
	--font-p: 1rem;
	--font-small: 0.875rem;	
	
	
	--padder: 1.5rem;
	--bs-gutter-x: 1.5rem;
}
}

body {
	background-color: var(--clr-white);
	color: var(--clr-blue);
	font-family:CeraPro-Light;
	line-height: 1.5;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
	font-family: CeraPro-Regular;
	font-weight: normal;
	line-height: 1.3;
	margin-bottom: 0.25em;
}

h1, .h1 {
	font-size: var(--font-h1);
	line-height: 1.1;
	max-width: 25ch;
}

h2, .h2 {
	font-size: var(--font-h2);
	margin-bottom: 0.5em;;
}

.heimatstubeh2 {
	font-size: var(--font-h3);
	font-family: CeraPro-Bold;
	margin-bottom: calc(.5*var(--padder));
}

h3, .h3 {
	font-size: var(--font-h3);
	font-family:CeraPro-Regular;
	max-width: 600px;
}

h4, .h4 {
	font-size: var(--font-h4);
	font-family: CeraPro-Regular;
	font-weight: normal;
	line-height: 1.3;
	margin-bottom: 0.5em;
}

a, a:hover {
	color: inherit;
	text-decoration: underline;
	text-decoration-thickness: auto;
	text-decoration-thickness: 1px;
	text-underline-offset: 5px;
	transition: .5s transform ease;
	transform-origin: left bottom;
}

a:hover, footer .nav-item a:hover {
	text-decoration-color: var(--clr-red);
	color: var(--clr-red);
	transform: skewX(-8deg);
	transform-origin: left bottom;
	transition: .5s transform ease;
	will-change: transform;	
}

a[target="_blank"], a[href$=".pdf"]::after {
	padding-right: 15px;
}

a[target="_blank"]::after, a[target="blank"] h2::after, a[target="_blank"] h2::after, a[href$=".pdf"]::after {
	content: "F";
	font-family: amatiksymbols;
	display: inline-block;
	font-size: 12px;
	padding-left: 5px;
	position: absolute;
}

.introwrapper[target="_blank"]::after {
	content: "";
	padding-left: 0px;
	padding-right: 0;
	display: none;
}

.introwrapper[target="_blank"] {
	padding-right: 0;
}

.introwrapper, .introwrapper:hover {
	text-decoration: none;
	color: var(--clr-blue);
}

a[href$=".pdf"]::after {
	content: 'E';
	font-size: 24px;
	margin-top: -10px;
	margin-left: -7px;
}

.dach {
	font-size: var(--font-dach);
	font-family: CeraPro-Light;
	font-weight: normal;
	line-height: 1.3;
	padding-bottom: 0em;
	color: var(--clr-blue);
	display: block;
}

.catintro .dach {
	margin-bottom: 1.1rem;
}

strong, .strong {
	font-family: CeraPro-Bold;
	font-weight: normal;
}

.introtext strong {
	font-size: calc(0.8 *var(--font-p));
	letter-spacing: 0.1em;
}

.bigintro p strong {
	font-size: calc( 0.8 * var(--font-h3));
	letter-spacing: 0.1em;
}

.thin {
	font-family:CeraPro-Regular;
}

.center {
	text-align: center;
}

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

p {
	font-size: var(--font-p);
	margin-bottom: 0;
	padding-bottom: calc(var(--padder) / 1.6);
	max-width: 70ch;
}

p:last-child {

}

p + figure {
	margin-bottom: calc(1.5 * var(--padder));
}

ul {
	font-size: var(--font-p);
	padding-left: 0;
	margin-left: 0;
	margin-bottom: var(--padder);
	list-style: none;
}

li {
	padding-left: 0rem;
	margin-bottom: 0rem;
	max-width: 62ch;
}

ul li::marker {
	content: '';
}

main ul li::before {
	content: '◊';
	padding-right: .25rem;
}

main .filter ul li::before {
	content: '';
}

.com-content-article li {
	font-size: var(--font-p);
}

img, svg {
	vertical-align: middle;
	max-width: 100%;
	height: auto;
}

.container {
	max-width: 100%;
    padding-inline: var(--padder);
}

.container.full {
    width: 100%;
    max-width: 100%;
    padding-inline: 0;
}

.clearblock {
	width: 100%;
	height: calc(1.5 * var(--padder));
}

.clearblock.small {
	height: calc(var(--padder) / 1.6);
}

.clearblock.big {
	height: calc(3 * var(--padder));
}

.centerblock.large {
	width: 100%;	
	max-width: 1000px;
	margin: 0;
}

.readmore, .btn, .btn.reverse:hover {
	font-size: var(--font-btn);
	text-transform: uppercase;
	letter-spacing: var(--letter-spacer);
	font-family: CeraPro-Bold;
	text-decoration: none;	
}

.btn:hover, .btn.reverse:hover {
	transform: skew(0deg);
}

.readmore {
	width: max-content;
	position: relative;
	margin-top: .5rem;
	display: block;
}

.readmore::after {
	background-image: url(../images/pfeil.png);
	width: 45px;
	content: '  ';
	background-size: 100px;
	background-repeat: no-repeat;
	background-position: right center;
	height: 20px;
	margin-left: 10px;
	display: block;
	top: 0;
	right: -55px;
	transition: .5s all ease;
	position: absolute;
}

.readmore.reverse::after {
	background-image: url(../images/pfeil.png);
	width: 50px;
	content: '  ';
	display: block;
	float: left;
	background-size: 100px;
	background-repeat: no-repeat;
	background-position: right center;
	height: 20px;
	right: 0;
	margin-left: 0px;
	transition: width 0.2s ease-in-out 0s;
	transform: rotate(180deg);
	margin-right: 10px;
	position: relative;
}

.readmore:hover::after, .item-content:hover .readmore::after {
	width: 75px;
	right: -85px;
}

.readmore.reverse:hover {
	-webkit-transform: skewX(-8deg);
	transform: skewX(-8deg);
	border-bottom: 0;
	text-decoration: none !important;
	transform-origin: left bottom;
	transition: .5s transform ease;
	will-change: transform;
}

.readmore.reverse:hover::after {
	width: 50px;
	right: 0;
}

.readmore:hover {
	text-decoration: none;
}

.footer .readmore {
	display: block;
	margin: auto;
}

.footer a:hover .readmore {
	color: var(--clr-red);
}

.footer .readmore::after {
	background-image: none;
	background-size: 0;
	margin-left: 0;
	width: 0;
	height: 0;
}

.btn, .btn.reverse:hover {
	background-color: transparent;
	color: var(--clr-blue);
	border-radius: 0;
	border-color: var(--clr-blue);
	padding: 0.475em 1.85em;
	margin-top: calc(var(--padder) / 4);
	text-decoration-color: transparent;
	width: max-content;
}

.btn:hover, .btn.active, .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle, .btn.reverse {
	background-color: var(--clr-blue);
	color: var(--clr-white);
	border-radius: 0;
	border-color: var(--clr-blue);
	text-decoration-color: transparent;
	width: max-content;
}

.language {
	margin-top: -.25rem;
	margin-bottom: -.4rem;
}

.language .btn, .language .btn.reverse:hover {
	background-color: transparent;
	color: var(--clr-blue);
	border-radius: 0;
	border-color: var(--clr-red);
	padding: 0.25rem .75rem;
	margin-top: 0px;
	text-decoration-color: transparent;
	width: max-content;
	text-transform: none;
	font-size: var(--font-dach);
	font-family: CeraPro-Regular;
	line-height: 1.3;
}

.language .btn:hover, .language .btn.reverse {
	background-color: var(--clr-red);
	color: var(--clr-white);
	border-radius: 0;
	border-color: var(--clr-red);
	text-decoration-color: transparent;
	width: max-content;
}

.muster.full, .muster {
	width: 100%;
	max-width: 100%;
	margin-bottom: 3rem;
	height: 20px;
	background-image: url(../images/raute-rot.svg);
	background-size: 14px 20px;
	background-repeat: round;
	margin-left: 0;
	margin-top: 0rem;
	background-clip: border-box;
}

.muster {
	width: 100%;
	max-width: 400px;
	margin-bottom: 0rem;
	margin-top: 0rem;
}

.caption, figcaption {
	display: block;
	min-height: 40px;
	font-size: var(--font-dac);
	padding-block: 0.5rem;
	margin-bottom: 0.25rem;
	max-width: 80ch;
}

.gallery .caption {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.catintro .caption {
	width: 100%;
	float: right;
	max-width: 400px;
	clear: both;
}

@media (max-width: 810px){
.catintro .caption {
	width: 100%;
	float: left;
	max-width: 100%;
	clear: both;
}
}

@media (max-width: 1024px){
.clearblock {
	width: 100%;
	height: calc(2 * var(--padder));
}
}

@media (max-width: 480px){
	
.muster.full, .muster {
	height: 15px;
	background-size: 10px 15px;
	max-width: 100%;
}	

.muster {
	max-width: 240px;
}

.teaser p {
	display: none;
}

}

/* Hintergrundfarben */

.yellow {
	background-color: var(--clr-yellow);
}

.blue {
	background-color: var(--clr-blue);
}

/* Grid Systeme */

.masonry-1 {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2rem;
	max-width: 1420px;
	margin: auto;
}

.masonry-2 {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 2rem;
	margin: auto;
	row-gap: var(--marger-btm);
}

.masonry-3 {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 2rem;
	row-gap: 4rem;
}

@media (max-width: 1380px){
.menuopen .masonry-3  {
	grid-template-columns: 1fr 1fr;
}
}

@media (max-width: 1024px){
.masonry-3, .menuopen .masonry-3  {
	grid-template-columns: 1fr 1fr;
}
}

@media (max-width: 810px){
.masonry-2, .masonry-3, .menuopen .masonry-3  {
	grid-template-columns: 1fr;
	row-gap: var(--padder);
}
}

/* Header */


/* Logo */

.logowrapper {
	position: fixed;
	bottom: var(--padder);
	left: var(--padder);
	width: 200px;
	height: 167px;
	background-image: url(../images/logoblau.png);
	background-size: 100%;
	transition: all 0.2s ease-in-out;
	background-position: left 0px;
	background-repeat: no-repeat;
	transition-delay: .2s;
	z-index: 1;
}

.startseite .logowrapper {
	background-image: url(../images/logo.png);
}


.up .logowrapper, .logowrapper.shrink, .fp-viewing-1 .logowrapper, .fp-viewing-2 .logowrapper, .fp-viewing-3 .logowrapper, .fp-viewing-4 .logowrapper, .fp-viewing-5 .logowrapper, .fp-viewing-6 .logowrapper {
	height: 58px;
	background-position: left -60px;
}

.logowrapper:hover {
	transform: skewX(0);
}

.logo img {
	width: 100%;
}

/* Logo Startseite */

.startseite .logowrapper::after {
	content: '';
	color: var(--clr-white);
	position: absolute;
	right: -270px;
	font-size: var(--font-slogan);
	display: block;
	width: 260px;
	font-family: CeraPro-Regular;
}

.fp-viewing-1 .logowrapper::after {
	content: 'is Verstahn.';
}

.fp-viewing-2 .logowrapper::after {
	content: 'ist Austausch.';
}

.fp-viewing-3 .logowrapper::after {
	content: 'ist Tradition.';
}

.fp-viewing-4 .logowrapper::after {
	content: 'ist Vielfalt.';
}

.fp-viewing-5 .logowrapper::after {
	content: 'ist Bewahren.';
}

.fp-viewing-6 .logowrapper::after {
	content: 'sind wir.';
}

.fp-viewing-7 .logowrapper::after {
	content: 'unterstützen.';
}

@media (max-width: 1024px){
.logowrapper {
	background-image: url(../images/logomobil.png);
}	
}

@media (max-width: 500px){
	
.logowrapper {
	width: 150px;
	height: 125px;
}	
	
.up .logowrapper, .logowrapper.shrink, .fp-viewing-1 .logowrapper, .fp-viewing-2 .logowrapper, .fp-viewing-3 .logowrapper, .fp-viewing-4 .logowrapper, .fp-viewing-5 .logowrapper, .fp-viewing-6 .logowrapper {
	height: 43px;
	background-position: left -45px;
	bottom: calc(3*var(--padder));
}

.up .logowrapper {
	bottom: calc(1*var(--padder));
}
.startseite .logowrapper::after {
	color: var(--clr-blue);
	position: absolute;
	right: auto;
	font-size: 2rem;
	display: block;
	width: max-content;
	font-family: CeraPro-Regular;
	bottom: calc(-2*var(--padder));
	left: 0;
	background-color: var(--clr-white);
	padding: 0 0.75rem;
}

}

/* Burger */

/* Burger */

.burgerwrapper {
	position: relative;
	transition: ease-in-out 0.1s;
}

.burger {
	background-color: var(--clr-white);
	width: 2.8125rem;
	height: 2.8125rem;
	border-radius: 1.75rem;
	position: fixed;
	right: calc(var(--padder) - 15px);
	top: calc(0.5*var(--padder));
	cursor: pointer;
	z-index: 1;
}

.burgerlayer {
	background-color: var(--clr-red);
	width: 1.6875rem;
	height: 2px;
	position: absolute;
	transition: ease-in-out 0.1s;
	left: calc(sin(45deg) * .8rem);
}

.burgerlayer.top {
	top: 1.125rem;
}

.burgerlayer.bottom {
	bottom: 1.125rem;
}

.menuopen .burgerlayer.top {
	transform: rotate(45deg);
	transform-origin: 45%;
	top: 1.25rem;
}

.menuopen .burgerlayer.bottom {
	transform: rotate(-45deg);
	transform-origin: 45%;
	bottom: 1.3rem;
}

@media (max-width: 1024px){
	
.menuopen .burgerlayer {
	background-color: var(--clr-red);
	width: 1.6875rem;
	height: 2px;
	position: absolute;
	transition: ease-in-out 0.1s;
	left: calc(sin(45deg) * .8rem);
}

.menuopen .burgerlayer.top {
	top: 1.125rem;
	transform: rotate(0deg);
}

.menuopen .burgerlayer.bottom {
	bottom: 1.125rem;
	transform: rotate(0deg);
}

.burgerlayer.top {
	transform: rotate(45deg);
	transform-origin: 45%;
	top: 1.25rem;
}

.burgerlayer.bottom {
	transform: rotate(-45deg);
	transform-origin: 45%;
	bottom: 1.3rem;
}	
	
}

/* Menu */

.nav {
	margin-left: 0;
	font-size: var(--font-menu);
	display: grid;
	gap: .5rem;
}

.nav-item {
	padding-left: 0;
	margin-bottom: 0;
}

.nav-item::marker {
	content: '';
}

.nav-item a {
	text-decoration: none;
}

.nav-item.active a {
	color: var(--clr-red);
}

.mainmenu {
	font-family: CeraPro-Regular;
	background-color: var(--clr-white);
	color: var(--clr-blue);
	position: fixed;
	width: 280px;
	transition: ease-in-out 0.2s;
	overflow-y: auto;
	height: 100vh;
	height: 100svh;	
	border-left: 1px solid var(--clr-red);
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding: 3rem var(--padder);
	padding-right: 0;
	padding-left: 3rem;
}

/* Ssocialmenü */

.nav.social {
	grid-template-columns: 35px 35px 35px 35px 35px;
	gap: 0;
	margin-top: var(--padder);
	margin-bottom: .5rem;
	height: 35px;
}

.symbol {
	font-family: social !important;
	font-size: 25px !important;
}

.symbol[target="_blank"]::after {
	content: '';
}

.nav-item.item-118 .symbol {
	color: transparent;
	background-image: url(../images/mastodon.svg);
	background-repeat: no-repeat;
	background-size: 25px;
	padding-right: 1px;
}

.nav-item.item-118:hover .symbol {
	background-image: url(../images/mastodon_hover.svg);
}


/* Submenu */

.nav.submenu {
	line-height: 1;
	margin-bottom: 2.5rem;
}

.submenu a {
	font-size: var(--font-dach-small);
}

/* Adresse Menü */

.moduletable.address p {
	font-size: var(--font-dach-small);
	margin-block: calc(.5*var(--padder));
	padding-bottom: 0;
}

/* Menu Footer */

.section.snapbox.footer-menu, .footer-menu {
	min-height: 0;
	height: auto;
	background-color: var(--clr-red);
	color: var(--clr-white);
	padding-inline: var(--padder);
	display: flex;
	flex-wrap: wrap;
	flex-direction: row-reverse;
	padding-block: calc(1.5*var(--padder));
	padding-bottom: calc(1.25*var(--padder));
}

.footer-menu ul {
	display: flex;
	gap: 2rem;
}

.footer-menu ul li::before {
	content: '';
}

.footer-menu a:hover, .com-content-article .footer-menu li {
	font-size: var(--font-menu);
}

.footer-menu a:hover, .footer-menu .nav-item.active a {
	color: var(--clr-white);
	text-decoration: underline;
}

.footer-menu .fp-overflow {
	overflow: visible;
}

@media (max-width: 810px) {
	  body:has(.section.snapbox.footer-menu.active) .logowrapper {
	bottom: calc(1*var(--padder));
	}

	.footer-menu ul {
		display: grid;
		gap: 1rem;
		text-align: right;
	}
}

@media (max-width: 500px) {
body:has(.section.snapbox.footer-menu.active) .logowrapper {
    bottom: calc(1*var(--padder));
    height: 43px;
    background-position: left -45px;
}
}

@media (max-width: 380px) {
  .footer-menu ul {
    max-width: min-content;
	gap: 0rem;
  }

  .footer-menu a {
	line-height: 1;
	display: block;
}
}

/* Main */

.menuopen .pagewrapper {
	display: grid;
	grid-template-columns: 1fr 300px;
	transition: ease-in-out 0.2s;
}

.pagewrapper {
	display: grid;
	grid-template-columns: 1fr 0;
	transition: ease-in-out 0.2s;
}

.contentwrapper {
	order: -1;
	overflow: hidden;
	padding-top: 3rem;
}

.startseite .contentwrapper {
	padding-top: 0;
}

main {

}

@media (max-width: 810px){

}

@media (max-width: 1024px){

/* .menuopen .pagewrapper {
	display: grid;
	grid-template-columns: 1fr 0px;
}

.menuopen .contentwrapper {
	overflow: visible;
	transition: ease-in-out 0.2s;
}

.pagewrapper {
	display: grid;
	grid-template-columns: 0fr 1fr;
}

.contentwrapper {
	overflow: hidden;
	transition: ease-in-out 0.2s;
}

*/

.pagewrapper, .menuopen .pagewrapper {
	display: block;
}

.mainmenu {
	position: fixed;
	right: 0;
	z-index: 2;
	padding-bottom: calc(4*var(--padder));
	padding-left: 3rem;
}

.menuopen .mainmenu {
	width: 0;
	right:-3.1rem;
}

.burgerwrapper {
	z-index: 3;
}

#fp-nav {
	display: none;
}

}

/* Content */

/* Startseite */
/*
.startseite {
	height: 100vh;
	overflow-y: hidden;
}

*/

.startseite footer {
	display: none;
}

#fp-nav {
	width: 45px;
}

#fp-nav.fp-right {
	right: calc(-5px + var(--padder));
	transition: ease-in-out 0.2s;
}


.menuopen #fp-nav.fp-right {
	right: 300px;
}

.fp-viewing-0 #fp-nav, .menuopen .fp-viewing-0 #fp-nav  {
	left: var(--padder);
}
	

#fp-nav ul li a span, .fp-slidesNav ul li a span {
	background: var(--clr-white);
}

#fp-nav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li a.active span, .fp-slidesNav ul li:hover a.active span {
	background: var(--clr-red);
}

#fp-nav ul li a, .fp-slidesNav ul li a {
	pointer-events: none;
}

.snapbox {
	padding: 0;
	min-height: 100vh;
	min-height: 100svh;	
	background-size: cover;
	background-position: center;

}

.fp-watermark {
	display: none;
}

.teaser {
	margin-top: var(--padder);
	margin-left: var(--padder);
	background: var(--clr-white);
	padding: calc(0.74* var(--padder));
	max-width: 300px;
}

.teaser h2 {
	font-size: var(--font-h3);
	padding-top: .5rem;
}

.teaser p {
	font-size: var(--font-small);
}

@media (max-width: 810px){

.teaser {
	margin-top: 0;
	margin-left: 0;
	background: var(--clr-white);
	padding: calc(1* var(--padder));
	max-width: 100%;
}
	
}


@media (max-width: 480px){
.teaser {
	padding-top: calc(1.2* var(--padder));
}
}

/* Newsflash Startseite */

.newswrap {
	float: right;
	opacity: 1 !important;
	height: 100vh;
	height: 100svh;
	padding: calc(0.74* var(--padder));
	max-width: 440px;
	background-color: var(--clr-red);
	padding-top: 3rem;
	padding-right: calc(0.5* var(--padder));
}

.startseite .newswrap {
	display: none;
}

.startseite .section.snapbox.start .newswrap {
	display: block;
}

.newsscroll {
	scrollbar-width: thin;
	scrollbar-color: var(--clr-white) rgba(255,255,255,0.1);
	overflow-y: scroll;
	height: 100%;
	padding-right: calc(0.74*var(--padder));
	overflow-x: hidden;
}

.newsscroll::-webkit-scrollbar {
  width: 5px;
}

.newsscroll::-webkit-scrollbar-thumb {
  background: var(--clr-white);
}

.newsscroll::-webkit-scrollbar-track {
  background: rgba(255,255,255,0.1);
}

.moduletable.newsflashstart {

}

.moduletable.newsflashstart * {
	color: var(--clr-white);
}

.moduletable.newsflashstart h3 {
	font-size: var(--font-slogan) !important;
	color: var(--clr-blue);
}

.moduletable.newsflashstart .muster {
	margin-bottom: calc(.5*var(--padder));
	color: ;
	filter: brightness(0) invert(1);
}



@media (max-width: 810px){
.moduletable.newsflashstart.hidemobile {
	display: none;
}

.moduletable.newsflashstart.showmobile h3, .moduletable.newsflashstart.showmobile .muster {
	display: none;
}

.newswrap {
	float: left;
	height: auto;
	max-width: 100%;
	padding: var(--padder);
}

.newswrap .slick-initialized .slick-slide {
	display: block;
	padding-inline: 0;
}

.newsscroll {
	overflow-y: visible;
	overflow-x: visible;
}

.newswrap .introwrapper {
	display: grid;
	grid-template-columns: .25fr 1fr;
	gap: 1rem;
}

.newswrap .introimage img {
	margin-bottom: 0;
	aspect-ratio: 1/1;
	object-fit: cover;
	object-position: center;
}

.newswrap .introtext, .newswrap .introtext h2 {
	max-width: calc(100% - var(--padder));
}

.newswrap .introtext p {
	display: block;
	padding-bottom: 0;
}

}

@media (max-width: 480px){
.newswrap .introtext p {
	display: none;
}

.newswrap .introtext h2 {
	font-size: 1rem;
}

}

/* Übersichten */

/* Kategorie Intro */

.catintro {
	display: grid;
	grid-template-columns: 2fr 1fr;
	margin-bottom: var(--padder);
	gap: var(--padder);
}

.catintro.full {
	display: block;
}

.catintro p {
	max-width: 42ch;
	font-size: var(--font-p-big);
}

.catintro.full p {
	max-width: 44ch;
	font-size: var(--font-p-big);
}

.catintro img {
	width: 100%;	
	max-width: 400px;
	height: auto;
	float: right;
}

@media (max-width: 810px){
.catintro {
	grid-template-columns: 1fr;
	margin-bottom: calc(2*var(--padder));
}	

.catintro img {
	max-width: 100%;
}

}

/* Artikel Intro */

.item-content, .item-content:hover {
	text-decoration: none;
	color: var(--clr-blue);
}

.item-content * {
	transition: .5s transform ease;
	transform-origin: left bottom;
	will-change: transform;
}

.item-content:hover .introtext *, .masonry-10 .item-content:hover h2, .masonry-10 .item-content:hover .readmore {
	-webkit-transform: skewX(-8deg);
	transform: skewX(-8deg);
	border-bottom: 0;
	text-decoration: none !important;
	transform-origin: left bottom;
	transition: .5s transform ease;
	will-change: transform;
}

.item-content:hover .introtext img {
	transform: skew(0deg);
}

.blog-items {
	padding-left: calc(200px + var(--padder));
}

@media (min-width: 1920px){
.blog-items {
	padding-left: calc(300px + var(--padder));
}
}

.introimage img {
	margin-bottom: .75rem;
	width: 100%;
	aspect-ratio: 16/9;
	object-fit: cover;
	object-position: top;
}

.introtext .dach {
	font-size: var(--font-dach-small);
	font-family: CeraPro-Light;
	margin-bottom: .25rem;
}

.introtext h2 {
	font-size: var(--font-h2-small);
}

.introtext p {
	font-size: var(--font-p-small);
}

@media (max-width: 810px){
.blog-items {
	padding-left: 0;
}

}


/* Masonry-10 Changes */

.masonry-10 {
	display: grid;
	gap: calc(2*var(--padder));
}

.masonry-10 .introwrapper {
	display: block;
}

.masonry-10 .introwrapper.minheight {
	min-height: 110px;
}

.masonry-10 .introtext .dach {
	display: none;
}

.masonry-10 .introwrapper img {
	width: 100px;
	height: auto;
	aspect-ratio: 1/1;
	float: left;
	margin-right: 1rem;
}

.masonry-10 h2 {
	font-size: var(--font-h2);
	margin-bottom: .2em;
}

.masonry-10 .muster {
	max-width: 440px;
	margin-bottom: calc(.75*var(--padder));
}

.masonry-10 .introtext p {
	font-size: var(--font-p);
	padding-bottom: 0;
	max-width: 62ch;
}

/* Detailseite */

.bigimg img {
	width: 100%;
}

/* Heimatstuben */

.heimatstube {
	aspect-ratio: 16/9;
}

/* Pagination */

.pagination {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(2.3rem, max-content));
	justify-content: center;
	grid-gap: 0rem;
	max-width: calc(100vw - var(--padder) - var(--padder));
}

.page-link {
	padding: 0;
}

.page-item {
	margin-left: 0.1rem;
	margin-right: 0.1rem;
}

.page-item.disabled .page-link {
	color: var(--clr-blue);
	pointer-events: none;
	background-color: transparent;
	border-color: transparent;
	opacity: 0.5;
}

.page-item:first-child .page-link, .page-item:last-child .page-link {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}

.page-link {
	color: var(--clr-blue);
}

.page-link {
	position: relative;
	display: block;
	color: var(--clr-blue);
	text-decoration: none;
	background-color: transparent;
	border: 0px solid #dee2e6;
}

.page-link:hover {
	z-index: 0;
	color: var(--clr-white);
	background-color: var(--clr-blue);
	border-color: var(--clr-blue);
}

.page-item.active .page-link {
	z-index: 0;
	color: var(--clr-white);
	background-color: var(--clr-blue);
	border-color: var(--clr-blue);
}

main .pagination li::before, main .pagination li::marker {
	content: '';
	display: none;
}

.icon-angle-double-left::before {
	content: '«';
}

.icon-angle-left::before {
	content: '‹';
}

.icon-angle-double-right::before {
	content: '»';
}

.icon-angle-right::before {
	content: '›';
}

.com-content-category-blog__navigation {
	display: grid;
	justify-content: center;
	text-align: center;
}

.com-content-category-blog__counter.counter.float-end.pt-3.pe-2 {
	padding: 0;
	padding-right: 0 !important;
	padding-bottom: .5rem;
	padding-top: 2rem !important;
	max-width: 100%;
}

@media (max-width: 810px){
	
.pagination .page-item {
	display: none;
}	

.pagination .page-item:last-child,
.pagination .page-item:nth-last-child(2),
.pagination .page-item:first-child,
.pagination .page-item:nth-child(2),
.pagination .disabled.page-item {
	display: block;
}
	
.pagenavigation .icon-chevron-left, .pagenavigation .icon-chevron-right {
	width: 20px;
	height: 20px;
	margin-top: 3px;
}

}


/* Footer */

.footer.container.full.masonry-2 {
	min-height: 100vh;
	min-height: 100svh;
	gap: 0;
}

.container.footergrid {
	display: grid;
	align-items: center;
	background-size: 130%;
	background-repeat: no-repeat;
	overflow-x: hidden;
	padding-block: var(--padder);
}

.container.footergrid a {
	color: var(--clr-white);
	text-decoration: none;
}

.footergrid h2 {
	font-size: var(--font-h2-big);
	text-transform: uppercase;
	letter-spacing: var(--letter-spacer);
}

.footergrid p {
	font-size: var(--font-h2-small);
	max-width: 24ch;
	margin: auto;
	font-family: CeraPro-Regular;
}

.container.footergrid.center.yellow {
	background-image: url(../images/left.png);
	background-position: center right;
}

.container.footergrid.center.blue {
	background-image: url(../images/right.png);
	background-position: center left;
}

@media (max-width: 810px){
.container.footergrid {
	min-height: 100vh;
	min-height: 100svh;	
}

.container.footergrid.center.blue {
		min-height: 110vh;
	min-height: 110svh;	
}

}

/* Modal Popup */

.modal-dialog {
	max-width: calc(100% - var(--padder) * 2);
	margin: 8vw auto;
	width: 800px;
}

.modal-header {
	padding: 0;
	border-bottom: 1px solid var(--clr-blue);
	border-top-left-radius: calc(.3rem - 1px);
	border-top-right-radius: calc(.3rem - 1px);
	margin: var(--padder);
	margin-bottom: calc(0.5 * var(--padder));
}

.modal-body {
	position: relative;
	flex: 1 1 auto;
	padding: 0;
	margin: 0 var(--padder);
}

.modal-content {
	border: 0px solid rgba(0,0,0,.2);
	border-radius: 0;
	outline: 0;
}

.modal-footer {
	border-top: 0;
	padding: 0;
	margin-bottom: var(--padder);
}

/* Bildergalerie */

.slick-initialized .slick-slide {
	display: block;
	padding-inline: .5rem;
}

/* Accordion */

.accordeonintro {
	max-width: 500px;
	margin-bottom: var(--padder);
}

.accordeonintro h3 {
	font-family: CeraPro-Regular;
}

.accordeonintro.flat {
	margin-bottom: 0.5rem;
}

.accordion-flush .accordion-item:first-child {
	border-top: 1px solid var(--clr-blue);
}

.accordion-item {
	background-color: transparent;
	border: 1px solid var(--clr-blue);
}

.accordion-button {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	padding: calc(var(--padder) / 4) 0;
	font-size: var(--font-p);
	color: var(--clr-blue);
	text-align: left;
	background-color: transparent;
	border: 0;
	border-radius: 0;
	overflow-anchor: none;
	transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,border-radius .15s ease;
	font-family:CeraPro-Regular;
	padding-right: var(--padder);
}

.accordion-button:focus {
	z-index: 3;
	border-color: transparent;
	outline: 0;
	box-shadow: none;
}

.accordion-button::after {
	flex-shrink: 0;
	width: 1.25rem;
	height: 1.25rem;
	margin-left: auto;
	content: "+";
	background-image: none;
	background-repeat: no-repeat;
	background-size: 0;
	transition: transform .2s ease-in-out;
	line-height: 1;
	position: absolute;
	right: 0;
}

.accordion-button:not(.collapsed) {
	color: var(--clr-blue);
	background-color: transparent;
	box-shadow: none;
	font-family: CeraPro-Regular;
}

.accordion-button:not(.collapsed)::after {
	background-image: none;
	content: '–';
	font-size: 1.7rem;
	line-height: 1;
	margin-top: -0.7rem;
	color: var(--clr-blue);
	transform: none;
	font-family:CeraPro-Regular;
	padding-left: 1px;
}

.accordion-body {
	padding: calc(var(--padder) / 2) 0;
	padding-top: 0;
	font-size: var(--font-p);
}

/* Youtube Player */

.youtube-player {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	max-width: 100%;
	background: #000;
	margin-bottom: 0.5rem;
	z-index: 0;
}

.youtube-player .dsgvo-btn {
	position: absolute;
	z-index: 1;
	background-color: #fff;
	padding: 1rem;
	font-size: 0.65rem;
	display: none;
	margin: 0.5rem;
}

.youtube-player .dsgvo-btn p {
	font-size: 0.65rem;	
}

.youtube-player .dsgvo-btn .btn {
	margin-top: 0;
}

.youtube-player:hover .dsgvo-btn {
	display: block;
}

.youtube-player.noconsent {
	background: #fff;
}

.youtube-player.noconsent::before {
	content: 'Bitte stimmen Sie unseren Cookie- und Script-Einstellungen zu, damit YouTube-Videos geladen werden können.';
	padding: var(--padder);
	display: block;
	margin-top: 10%;
}

.youtube-player.noconsent .play {
	display: none;
}

.youtube-player iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 100;
background: transparent;
}

.youtube-player img {
object-fit: cover;
display: block;
left: 0;
bottom: 0;
margin: auto;
max-width: 105%;
width: 105%;
position: absolute;
right: 0;
top: 0;
border: none;
height: auto;
cursor: pointer;
-webkit-transition: 0.4s all;
-moz-transition: 0.4s all;
transition: 0.4s all;
}

.youtube-player img:hover {
-webkit-filter: brightness(75%);
}

.youtube-player .play {
	width: 3rem;
	height: 3rem;
	left: 50%;
	top: 50%;
	margin-left: -1.5rem;
	margin-top: -1.5rem;
	position: absolute;
	background-color: #fff;
	background-image: url('../images/Play.png');
	box-shadow: 0px 0px 15px #000;
	border-radius: 100%;
	cursor: pointer;
	background-repeat: no-repeat;
	background-size: 40%;
	background-position: 60% 50%;
	transition: all ease-in-out 0.2s;
}

.youtube-player .play:hover {
	transform: scale(1.1);
	transition: all ease-in-out 0.2s;
}

@media (hover: none) { 
.youtube-player .dsgvo-btn {
	display: block;
}
 }
 
/* MP3 Player */

/* BG */

/*
#audioplayer.size-med {
	font-family: 'CeraPro-Regular';
	width: 280px;
	height: 35px;
	position: relative;
	margin: 0;
	border-radius: 0;
	background: transparent;
	padding: 10px 0px;
	float: left;
	line-height: 1.3;
	clear: both;
}
*/


#audioplayer.size-med {
	font-family: 'CeraPro-Regular';
	width: 100%;
	height: auto;
	position: relative;
	margin-bottom: calc(1*var(--padder));
	background: var(--clr-yellow);
	padding: calc(.5*var(--padder));
	margin-top: calc(0.25*var(--padder));
	max-width: 480px;
}

#audioplayer .caption {
	width: 100%;
	color: var(--clr-blue);
	padding-bottom: 0;
	margin-bottom: 0;
	min-height: 0;
}

/*Play/Pause button*/
.size-med #songPlayPause {
	color: #023f87;
	cursor: pointer;
	float: left;
	width: 30px;
	height: 30px;
}

.size-med #songPlayPause img {
	height: 100%;
}

.size-med #songPlayPause.playing{
	font-weight: bold;
	height: 30px;
	overflow: hidden;
}

/*Song location slider*/
.size-med #songSlider {
	width: calc(100% - 30px);
	height: 30px;
	overflow: hidden;
	background: #023f87;
	position: relative;
	max-width: 400px;
	display: grid;
	align-items: center;
}

.size-med #songTitle {
	color: #fff;
	font-size: 14px;
	position: absolute;
	width: 100%;
	text-align: center;
	z-index: 1;
	height: 21px;
	left: 0;
	padding-left: 35px;
	padding-right: 35px;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}


/*Track progress bar*/
.size-med #trackProgress {
	width: 0;
	height: 30px;
	margin-top: 0px;
	overflow: hidden;
	position: relative;
	background: #e83e33;
}

.size-med #songTimeA{
	margin-top: 0px;
	position: absolute;
	left: 5px;
	font-size: 12px;
	color: #fff;
	pointer-events: none;
	cursor: default;
}

.size-med #songTimeB{
	margin-top: 0px;
	position: absolute;
	right: 5px;
	font-size: 12px;
	color: #fff;
	pointer-events: none;
	cursor: default;
	z-index: 1;
}

.size-med #songTimeC {
	position: absolute;
	left: 5px;
	font-size: 12px;
	color: #fff;
	pointer-events: none;
	cursor: default;
	top: 6px;
}

.size-med #songTimeD {
	position: absolute;
	text-align: right;
	left: 100%;
	width: 40px;
	font-size: 12px;
	color: #fff;
	pointer-events: none;
	cursor: default;
	top: 6px;
}

/* Mitglieder Filter */

.moduletable.filter {
	position: relative;
	font-size: var(--font-dach);
	background: #fff;
	margin-top: -.25rem;
	margin-bottom: -.25rem;
	z-index: 1;
}

.moduletable.filter h3 {
	font-size: var(--font-dach);
	border: 1px solid var(--clr-red);
	padding: .25rem .75rem;
	width: max-content;
	margin-bottom: 0;
	cursor: pointer;
	position: relative;
	background-image: url(../images/marker.png);
	background-size: 18px;
	background-repeat: no-repeat;
	background-position: center right;
	padding-right: var(--padder);
}

.mod-articlescategories.categories-module.mod-list {
	display: none;
	font-size: var(--font-dach);
	background-color: #ededed;
	position: absolute;
	margin-left: 0;
	padding: 1rem;
	border-top: .5rem solid var(--clr-white);
}

.moduletable.filter:hover .mod-articlescategories.categories-module.mod-list {
	display: block;
}

.mod-articlescategories.categories-module.mod-list li {
	padding-inline: 0rem;
	margin-bottom: 0;
	padding-block: 0rem;
	display: grid;
}

.mod-articlescategories.categories-module.mod-list li a {
	text-decoration: none;
	padding-inline: .5rem;
	margin-bottom: 0;
	padding-block: .25rem;	
}

.mod-articlescategories.categories-module.mod-list li.active a {
	color: var(--clr-red);
}

.mod-articlescategories.categories-module.mod-list li.active ul li a {
	color: var(--clr-blue);
}

.mod-articlescategories.categories-module.mod-list li a:hover, .mod-articlescategories.categories-module.mod-list li.active ul li a:hover {
	color: var(--clr-red);
	transform: skewX(0deg);
	
}

.mod-articlescategories.categories-module.mod-list li::marker {
	content: '';
}

.mod-articlescategories.categories-module.mod-list ul {
	font-size: var(--font-dach);
	margin-left: 0;
}

.mod-articlescategories.categories-module.mod-list ul li {
	padding-left: 0;
	padding-right: 0;
}

/* Kontaktformular */

.convertforms {
	background-color: #063F871A;
	padding-top: var(--padder);
	padding-bottom: var(--padder);
}

.cf-input.cf-width-auto {
	width: 100%;
	max-width: 680px;
	border: 0;
	font-size: var(--font-p);
	padding: .5rem;
}

.cf-control-group.cf-one-half {
	display: inline-block;
	width: 50%;
	max-width: 340px;
}

.cf-control-group.small h2 {
	font-size: var(--font-h3);
	font-family: CeraPro-Bold;
}

.cf-control-input h3 {
	font-size: var(--font-small);
	font-family: CeraPro-Bold;
}

.cf-control-input {
	padding-right: .25rem;
	padding-bottom: .5rem;
}

.cf-response p {
	background-color: green;
	color: #fff;
	padding: var(--padder);
}

.cf-checkbox-group {
	max-width: 680px;
	display: grid;
	grid-template-columns: 25px 1fr;
	align-items: start;
}

.convertforms input {
	color: var(--clr-blue);
}

.convertforms input::placeholder {
	color: var(--clr-blue);
}

.cf-input[type="checkbox"] {
	display: inline-block;
}

.cf-input[type="checkbox"] {
	margin-top: 5px;
}

.cf-btn.reverse {
	font-size: var(--font-btn) !important;
	background-color: var(--clr-blue)!important;
	padding: 0.475em 1.85em !important;
}

.cf-btn.reverse:hover {
	background-color: var(--clr-white)!important;
	color: var(--clr-blue)!important;
}

@media (max-width: 1430px){
	
.cf-control-group.cf-one-half {
	display: inline-block;
	width: 100%;
	max-width: 680px;
}
}	
 
.cf-success-hideform.cf-success .cf-fields  {
	display: none;
}

/* Cookie Hinweis */

#redim-cookiehint-bottom .cookiehead {
	margin-bottom: 10px;
	display: none;
}

#redim-cookiehint {
	padding: var(--padder);
	border-radius: 0px;
}

#redim-cookiehint .cookiehead .headline {
	color: var(--clr-blue);
	font-size: var(--font-h3);
	line-height: 1.5;
	position: relative;
	padding: 0;
	display: inline-block;
}

#redim-cookiehint .cookiecontent {
	line-height: 1.2;
	color: var(--clr-blue);
}

#redim-cookiehint .cookiecontent p {
	font-size: var(--font-menu-sub);
}

#redim-cookiehint-bottom .cookiebuttons {
	text-align: left;
}

#redim-cookiehint-bottom {
	box-shadow: none;
	text-align: center;
	background-color: var(--clr-white);
	border-top: 1px solid var(--clr-grey);
}

#cookiehintsubmit {
	background: var(--clr-blue) !important;
	color: var(--clr-white) !important;
}

#cookiehintsubmit:hover {
	background: var(--clr-white) !important;
	color: var(--clr-blue) !important;
}

#redim-cookiehint .cookiebuttons .btn, #redim-cookiehint .cookiebuttons button {
	font-size: var(--font-btn);
	line-height: 1.5;
	cursor: pointer;
	display: inline-block;
	margin-bottom: .5rem;
	padding: 0.475em 1.85em !important;
	text-align: center;
	width: max-content;
	box-sizing: border-box;
	border-radius: 0 !important;
}

#cookiehintsubmitno {
	color: var(--clr-blue) !important;
	background: var(--clr-white) !important;
}

#cookiehintsubmitno:hover {
	color: var(--clr-white) !important;
	background: var(--clr-blue) !important;
}

.youtube-player.noconsent {
	display: block;
	height: auto;
	width: 100%;
	padding: 0;
}

.youtube-player.noconsent img {
	display: none;
}

.youtube-player.noconsent::before {
	content: 'Bitte stimmen Sie unseren Cookie- und Script-Einstellungen (rechts unten im Menü) zu, damit YouTube-Videos geladen werden können.';
	padding: var(--padder);
	display: block;
	margin-top: 0;
	background: var(--clr-blue);
	color: var(--clr-white);
	margin-bottom: var(--padder);
	float: left;
	width: 100%;	
}

.heimatstube.noconsent {
	display: block;
	height: 0;
	width: 100%;
}

.heimatstube.noconsent::before {
	content: 'Bitte stimmen Sie unseren Cookie- und Script-Einstellungen (rechts unten im Menü) zu, damit die Heimatstube geladen werden kann.';
	padding: var(--padder);
	display: block;
	margin-top: 0;
	background: var(--clr-blue);
	color: var(--clr-white);
	margin-bottom: var(--padder);
	float: left;
	width: 100%;
	max-width: 1000px;
}

/* Login */

.form-control {
	border-radius: 0;
}

.com-users-login.login {
  	margin-top: 5rem!important;
	max-width: 400px;
	margin: auto;
	padding-left: var(--padder);
	padding-right: var(--padder);
}

.btn.btn-secondary.input-password-toggle {
	margin-top: 0;
	margin-left: 10px !important;
}

.icon-eye.icon-fw::before {
	content: '👁';
}