@font-face{
	font-family:"Akko Rounded";
	src:url("/static/fonts/akko/880799ea-3b2b-4feb-a380-8d0550c74e7a.woff2") format("woff2"),url("/static/fonts/akko/0e46023e-83d4-4f07-b075-0039e7a99f31.woff") format("woff");
	font-weight: 100;
	font-style: normal;
}
@font-face{
	font-family:"Akko Rounded";
	src:url("/static/fonts/akko/9a0c469a-bdd2-4617-bc09-ac1d9ebf89f3.woff2") format("woff2"),url("/static/fonts/akko/9c7e0c2d-5576-43a1-87e0-d84036f01ad1.woff") format("woff");
	font-weight: 200;
	font-style: normal;
}
@font-face{
	font-family:"Akko Rounded";
	src:url("/static/fonts/akko/65717e07-4dce-4cb1-a091-47ba6dd7222d.woff2") format("woff2"),url("/static/fonts/akko/fd72f9fe-5b70-4e81-9ac6-13c21c190abc.woff") format("woff");
	font-weight: 400;
	font-style: normal;
}
@font-face{
	font-family:"Akko Rounded";
	src:url("/static/fonts/akko/99234960-9a0f-431b-ad0b-342bb6c76208.woff2") format("woff2"),url("/static/fonts/akko/6256a19d-22ef-4f96-821f-7e87c73d2f4b.woff") format("woff");
	font-weight: 500;
	font-style: normal;
}
@font-face{
	font-family:"Akko Rounded";
	src:url("/static/fonts/akko/76ba4349-9431-4613-9238-c3b3ee0d7cba.woff2") format("woff2"),url("/static/fonts/akko/0cfff367-9769-4936-90fa-d3870d9f0acf.woff") format("woff");
	font-weight: 700;
	font-style: normal;
}

*{
	margin:0;
	padding:0;
	outline:none;
	border:none;
	text-decoration:none;
}

/*Kopf*/

nav{
	
	font-weight:400;
	font-size:18px;
	width:65%;
	height:40px;
	float:left;
	color:black;
	position:relative;
	top:70px;
	left:30px;
}

nav li{
	display:inline-block;
}

nav a{
	padding:0px;
	margin:0px 22px;
	line-height:39px;
	height:39px;
	display:inline-block;
	position:relative;
	color:#464648;
}

nav a:hover:before{
	content:"";
	background-image:url(/static/img/kringel_links.png);
	background-repeat:no-repeat;
	height:100%;
	position:absolute;
	width:32px;
	left:-32px;
}

nav a:hover{
	background-image:url(/static/img/hgb.png);
	background-size:100% 100%;
	position:relative;
}

nav a:hover:after{
	content:"";
	background-image:url(/static/img/kringel_rechts.png);
	background-repeat:no-repeat;
	height:100%;
	position:absolute;
	width:32px;
	right:-32px;
}

nav ul li:hover ul li{
	display:block;
}


nav ul ul{
	position:absolute;
	z-index:1;
	padding-bottom:10px;
	border-radius:0px 0px 10px 10px;
	background-color:rgba(255,255,255,0.85);
}

nav li li{
	display:none;
	padding:0px 20px;
	margin-left:-20px;
}

#logo{
	float:right;
	margin:30px 40px;
	position:relative;
	top:20px;
	right:20px;
	height:118px;
}

#logo img{
	width:280px;
}

/*Kopf*/

body{
	background-image:url(/static/img/background.jpg);
}

body.cms,
body#tinymce{
	background:none;
}

#page{
	width:1050px;
	margin:0 auto;
	background:white;
	box-shadow:5px 0px 10px rgba(0,0,0,0.2);
	font-family:'Akko Rounded';
}

/* Schriften */

h1{
	
	font-weight:500;
	font-size:51px;
	position:relative;
	line-height:1.1;
	margin-top:40px;
	color:#68273D;
	margin-bottom:20px;
}

#spalteRechts h1,
#spalteRechtsUnten h1{
	left: -320px;
	width: 650px;
	margin-bottom: 37px;
	margin-top: 72px;
}

.seiteCollage #spalteTotal{
	height:0;
	margin-top:-30px;
}

.seiteCollage #spalteTotal h1{
	left: 330px;
	width: 650px;
	top:40px;
	position:relative;
}

#spalteTotal h1{
	width:100%;
	position:static;
}

.start #spalteRechts h1,
.start #spalteRechtsUnten h1{
	margin-bottom: 0px;
	margin-top: 40px;
}

#spalteTotal .contenttext{
	padding-left:48px;
}

h1 i,
h1 em{
	color:#7DAA2B;
	text-transform:uppercase;
	font-style:normal;
}

h2{
	
	font-weight: 500;
	font-size: 30px;
	line-height: 32px;
	margin-bottom:20px;
	color: #7DAA2B;
}

#spalteRechts h2
#spalteRechtsUnten h2{
	font-weight:400;
	font-size:25px;
	margin:0px;
	line-height:32px;
}

h3{
	font-weight: 400;
	font-size: 20px;
	line-height: 27px;
	margin: 0px 0px 5px 0px;
}

#spalteRechts h3,
#spalteRechtsUnten h3{
	padding-left: 30px;
	background-image: url(/static/img/pfeil.png);
	background-repeat: no-repeat;
	background-position: left 10px top 6px;
	margin-top: 20px;
	background-size: 12px;
}

#page #spalteRechts h3 a,
#page #spalteRechtsUnten h3 a{
	color:#464648;	
}
	
#page #spalteRechts h3 a:hover,
#page #spalteRechtsUnten h3 a:hover{
	color:#7DAA2B;
	text-decoration:none;
}

#page h4{
	font-weight:400;
	font-size:25px;
	position:absolute;
	bottom:0;
	margin-top:20px;
}

#page .contentelement p strong{
	color:#2c2b2b;
	font-weight:500;
}

#page .contentelement p a{
	color:#982074;
}

#page #content a:hover{
	text-decoration:underline;
}


.contentelement li,
.contentelement p{
	font-weight:400;
	font-size:15px;
	color:#464648;
	line-height:24px;
}

.contentelement p{
	margin-bottom:16px;
}

.contentelement ul:not(.cmsMenuButtons){
	text-decoration:none;
	padding-left:30px;
	list-style-type:none;
}

.contentelement ul:not(.cmsMenuButtons) li{
	margin:8px 0;
	padding-left: 0px; 
	text-indent: -13px;
	color:#464648;
	font-weight:400px;
}

.contentelement ul:not(.cmsMenuButtons) li::before {
	content: "•";
	margin-right:5px;
	color: #7DAA2B; /* or whatever color you prefer */
}

/*Schriften*/


/* spalteTotal */

#spalteTotal::after {
	content: "";
	display: table;
	clear: both;
}

/*spalteLinks*/

#spalteLinks,
#spalteLinksUnten{
	float:left;
	width:620px;
}	

#spalteLinks .contenttext,
#spalteLinksUnten .contenttext{
	font-weight:400;
	font-size:15px;
	color:#464648;
	line-height:27px;
	margin-top:20px;
	padding-left:48px;
}

#spalteLinks .contenttext.sticker,
#spalteLinksUnten .contenttext.sticker{
	position:relative;
	padding-left: 35px;
}

#spalteLinks .contenttext.sticker::before,
#spalteLinksUnten .contenttext.sticker::before{
	content: "";
	width: 43px;
	height: 100%;
	border-radius: 12px 0px 0px 12px;
	background-color: #68273D;
	position: absolute;
	opacity: 0.85;
	left: -20px;
}

#spalteLinks .contenttext.map,
#spalteLinksUnten .contenttext.map{
	margin-top:40px;
	position:relative;
	padding-left:0px;
	padding-left:10px;
}

#spalteLinks .contenttext.map p,
#spalteLinksUnten .contenttext.map p{
	margin-bottom:0;
	height:400px;
	margin-left: 15px;
	display: block;
	max-width: 100%;
}

#spalteLinks .contenttext.map::before,
#spalteLinksUnten .contenttext.map::before{
	content: "";
	width: 38px;
	height: 100%;
	border-radius: 20px 0px 0px 20px;
	background-color: #7DAA2B;
	position: absolute;
	opacity: 0.85;
	left: -20px;
}

#spalteLinks .contenttext.map iframe,
#spalteLinksUnten .contenttext.map iframe{
	border-radius: 0px 20px 20px 0px;
}

.contentboxLinks{
	width: 280px;
	text-align: right;
	float: left;
	position: relative;
	left: 30px;
}

.collage{
	margin:35px 0px 0px -20px;
}

#spalteLinks .contentboxLinks .contentboxText p,
#spalteLinksUnten .contentboxLinks .contentboxText p{
	font-style:normal;
	font-size:24px;
	font-weight:500;
	line-height:32px;
	color:#7DAA2B;
}

#spalteLinks .contentboxLinks p i,
#spalteLinksUnten .contentboxLinks p i{
	font-style:normal;
	font-size:25px;
	font-weight:500;
	line-height:32px;
	margin-top:20px;
	color:#68273D;
}

.contentboxRechts,
.contentboxRechtsUnten{
	float:left;
	width:300px;
	margin-left:340px;
	position:absolute;
}

.contentboxRechts p i,
.contentboxRechtsUnten p i{
	
	font-style:normal;
	font-size:25px;
	font-weight:500;
	line-height:80px;
}

#spalteLinks .contentboxImg,
#spalteLinksUnten .contentboxImg{
	position:relative;
}

.contentboxImg:before{
	content:"";
	width:38px;
	height:100%;
	border-radius:20px 0px 0px 20px;
	background-color:#7DAA2B;
	position:absolute;
	opacity:0.85;
	left:-30px;
}

.contentboxImg img{
	border-radius:0px 20px 20px 0px;
	margin-left:15px;
	display:block;
	max-width: 100%;
}

.contentboxLinks .bu{
	bottom: -25px;
	left: 15px;
	position:absolute;
}

.contentboxLinks .bu p{
	
	font-weight:300;
	font-size:22px;
	color:rgba(233,208,217,1);
	line-height:27px;
}

.multifeld{
	width:100%;
	position:relative;
	margin:60px 0px;
}

#spalteLinks .multifeld,
#spalteLinksUnten .multifeld{
	left:-20px;
}

/*spalteRechts*/

#spalteRechts{
	float:right;
	width:329px;
	margin:152px 20px 20px 0px;
	position:relative;
}

#spalteRechtsUnten{
	width:329px;
	float:right;
	margin:20px 20px 20px 0px;
	position:relative;
}

#spalteRechts .contentbild,
#spalteRechtsUnten .contentbild{
	position: relative;
}

#spalteRechts .contentbild:after,
#spalteRechtsUnten .contentbild:after{
    content: "";
    width: 27px;
    height: 100%;
    background-color: #7DAA2B;
    position: absolute;
    top: 0;
    right: -34px;
    opacity: 0.85;
    border-radius: 0px 8px 8px 0px;
}

#spalteRechts .contentbild img,
#spalteRechtsUnten .contentbild img{
	border-radius: 20px 0px 0px 20px;
	margin-right: 15px;
	display: block;
	width: 100%;
	height:auto;
}

.pfeil{
	margin-right:20px;
}

#spalteRechts h2,
#spalteRechtsUnten h2{
	margin-top:20px;
	background-color:#68273D;
	border-radius:8px 0px 0px 8px;
	color:white;
	font-size:20px;
	text-transform:uppercase;
	line-height:24px;
	padding:13px 0px 13px 30px;
	letter-spacing:3px;
	position:relative;
	margin-bottom:20px;
}

#spalteRechts h2:after,
#spalteRechtsUnten h2:after{
	content:"";
	width:27px;
	height:100%;
	background-color:#7DAA2B;
	position:absolute;
	top:0;
	right:-34px;
	opacity:0.85;
	border-radius:0px 8px 8px 0px;
}

#spalteRechts h2 i,
#spalteRechtsUnten h2 i{
	opacity:0.4;
	text-transform:capitalize;
	letter-spacing:0;
	font-size:22px;
	font-style:normal;
	font-weight:400;
}

#spalteRechts p,
#spalteRechtsUnten p{
	padding:0px 10px 0px 30px;
	margin-top:5px;
}

.zitat{
	margin:60px 0px;
}

#spalteRechtsUnten .zitat{
	margin:0px;
}

.zitat p{
	font-size:20px;
	font-weight:400;
	color:#68273D;
	padding-right:0;
	line-height: 27px;
	padding-left: 0 !important;
}

.zitat p i,
.zitat p em{
	font-weight:400;
	color:#7DAA2B;
	font-style:normal;
	font-size:34px;
	line-height:40px;
}

#spalteRechts .contentbild,
#spalteRechtsUnten .contentbild{
	margin:25px 0px 40px;
}

h3 a{
	color:#464648;
}

#spalteLinks .contentboxRechts h3 a,
#spalteLinksUnten .contentboxRechts h3 a{
	color:#982074;
}

/*footer*/

footer{
	min-height:120px;
	margin:30px auto 0 30px;
	background-image:url(/static/img/buchstaben.png);
	background-repeat:no-repeat;
	background-position:right 20px bottom;
	display:flex;
	justify-content:space-between;
}

#zvs{
	display:flex;
}

#zvs img{
	width:60px;
	height:auto;
	padding-top:4px;
}

#zvs-logo {
	margin-right:15px;
}

#zvs-text p{
	font-weight:200;
	width:200px;
}

#zvs p a,
#zvs p a:visited{
	color: #982074;
}


footer ul{
	float:right;
	margin-right:80px;
}

footer li{
	
	font-weight:300;
	font-size:16px;
	display:inline-block;
	padding:15px 0px 40px 0px;
	margin:0px 20px;	
}

footer li a{
	color:#464648;
}

footer li a:hover{
	text-decoration:underline;
}

header:after,
#content:after{
	clear:both;
	display:table;
	content:"";
}

.clear{
	clear:both;
}
	
#buttonOpenMenu,
#buttonStart{
	display:none;
}
	
#buttonCloseMenu{
	color:white;
	margin:10px auto 10px;
	text-align:center;
	cursor:pointer;
	font-size:14px;
	display: table;
	padding: 0 20px;
}

#buttonCloseMenu:hover{
	text-decoration:underline;
}

.editmode .seiteCollage #spalteTotal{
	margin:20px 0;
	height:auto;
}

@media screen and (max-width:1130px){
	
	body{
		padding:0 40px;
	}
	
	#page{
		width:100%;
		overflow-x:hidden;
	}
	
	#logo{
		height:auto;
		margin-bottom:0;
	}
	
	#content{
		display:flex;
		flex-direction:column;
		padding:0 30px;
		box-sizing:border-box;
	}
	
	#spalteLinks,
	#spalteRechts,
	#spalteLinksUnten,
	#spalteRechtsUnten{
		width:100%;
		float:none;
		margin-top:0;
	}
	
	#spalteTotal .contenttext{
		padding:0;
	}
	
	#spalteLinks .contenttext,
	#spalteLinksUnten .contenttext{
		padding:0;
		margin:0 0 20px;
	}
	
	#spalteLinks .contenttext.sticker,
	#spalteLinksUnten .contenttext.sticker{
		padding:0;
	}
	
	#spalteLinks .contenttext.sticker::before,
	#spalteLinksUnten .contenttext.sticker::before{
		display:none;
	}
	
	#spalteRechts h1,
	#spalteRechtsUnten h1{
		position:static;
		width:100%;
		margin:30px 0 20px;
		font-size:30px;
	}
	
	.collage{
		margin:0;
	}
	
	h1{
		margin-top:10px;
	}
	
	.zitat{
		margin:20px 0;
	}
	
	.zitat p{
		padding:0;
	}
	
	#spalteRechts .contentbild,
	#spalteRechtsUnten .contentbild{
		margin:0;
	}
	
	.contentelement li, .contentelement p{
		max-width:600px;
	}
	
	.multifeld{
		margin:40px 0 20px;
		position:static;
		display:flex;
	}
	
	.contentboxLinks,
	.contentboxRechts{
		float:none;
		position:static;
		width:auto;
	}
	
	.contentboxRechts{
		margin-left:30px;
	}
	
	nav{
		left:0;
		top:0;
		width:100%;
		background:#7DAA2B;
		z-index:999;
		float:none;
		height:auto;
		position:absolute;
		padding:30px 0 30px;
		display:none;
	}
	
	nav.open{
		display:block;
	}
	
	nav ul{
		display:flex;
		flex-direction:column;
		position:static;
		align-items:center;
		justify-content:center;
		max-width:500px;
		margin:0 auto;
		width:100%;
	}
	
	nav ul ul{
		position:static;
		background:none;
		flex-direction:row;
		flex-wrap:wrap;
		height:auto;
		margin-bottom:10px;
	}
	
	nav ul li{
		position:static;
		text-align:center;
		display:block;
		margin:8px 0;
	}
	
	nav ul li a{
		color:white;
		font-size:26px;
		display:block;
		margin:0;
		padding:0;
		height:auto;
		line-height:130%;
	}
	
	nav ul li a:hover{
		text-decoration:underline;
	}
	
	nav ul li a.aktiv{
		font-weight:bold;
	}
	
	nav ul ul li a{
		font-size:18px;
	}
	
	nav a:hover{
		position:static !important;
		background:none !important;
		width:auto !important;
		right: auto !important;
	}
	
	nav a:hover::before,
	nav a:hover::after{
		display:none;
	}
	
	#buttonOpenMenu{
		display:flex;
		font-size:24px;
		cursor:pointer;
		background-image:url("/static/img/menuIcon.svg");
		background-repeat:no-repeat;
		height:30px;
		padding-left:37px;
		align-items:center;
	}
	
	#buttonStart{
		display:flex;
	}
	
	header{
		display:flex;
		justify-content:space-between;
		padding:30px;
		align-items:flex-start;
	}
	
	header::after{
		display:none;
	}
	
	#logo{
		margin:0;
		position:static;
	}
	
	#logo a{
		display:block;
	}
	
	#logo img{
		display:block;
	}
	
	img{
		max-width:100%;
		height:auto;
		min-height:1px
	}
	
	.seiteCollage #spalteTotal{
		margin:0;
		height:auto;
	}
	
	.seiteCollage #spalteTotal h1{
		position:static;
		width:100%;
		margin-bottom:40px;
		margin-top:0;
	}
	
	#spalteLinks .multifeld,
	#spalteLinksUnten .multifeld{
		left: 0px;
		max-width: 660px;
	}
	
	.zitat p i, .zitat p{
		margin-bottom:5px;
	}
	
	.zitat p i, .zitat p em{
		font-size:28px;
		line-height:36px;
	}
	
	.zitat p{
		font-size:18px;
	}
	
	#spalteRechts .contentbild,
	#spalteRechtsUnten .contentbild{
		max-width:580px;
		width:calc(100% - 34px);
	}
	
	#spalteRechts h2, #spalteRechtsUnten h2{
		padding: 13px 30px 13px 30px;
		display: table;
		max-width:580px;
		width:calc(100% - 34px);
		box-sizing:border-box;
	}
}

@media screen and (max-width:920px){
	
	body{
		padding:0 20px;
	}
	
}

@media screen and (max-width:620px){
	
	body{
		padding:0;
	}
	
	header{
		display:flex;
		flex-direction:column-reverse;
		padding:20px;
	}
	
	#content{
		padding:0 20px;
	}
	
	#logo{
		margin:10px auto 40px;
	}
	
	.multifeld{
		flex-direction:column;
		margin-top:30px;
	}
	
	.contentboxLinks{
		text-align:left;
	}
	
	.contentboxRechts{
		margin-left:0;
	}
	
	#spalteRechts p, #spalteRechtsUnten p{
		padding:0;
	}
	
	#spalteRechts h2, #spalteRechtsUnten h2{
		font-size:16px;
	}
	
	h1 {
	    font-size: 36px;
	    margin-top: 30px;
	    margin-bottom: 15px;
	}
	
	h2{
		font-size:24px;
		line-height:30px;
		margin-bottom:8px;
	}
	
	.zitat p i, .zitat p em{
		font-size:24px;
		line-height:29px;
	}
	
	.zitat p{
		font-size:16px;
	}
	
	#spalteLinks .contenttext.map::before, #spalteLinksUnten .contenttext.map::before{
		display:none;
	}
	
	#spalteLinks .contenttext.map, #spalteLinksUnten .contenttext.map{
		margin-top:20px;
	}
	
	#spalteLinks .contenttext.map, #spalteLinksUnten .contenttext.map{
		padding-left:0;
		width:100%;
	}
	
	#spalteLinks .contenttext.map iframe, #spalteLinksUnten .contenttext.map iframe{
		border-radius: 20px;
	}
	
	#spalteLinks .contenttext.map p, #spalteLinksUnten .contenttext.map p{
		padding:0;
		margin:0;
	}
	
	footer ul{
		margin:0;
		padding:0 0 0 20px;
		float:none;
	}
	
	footer ul li{
		padding:40px 0 0;
		margin-left:0;
	}
	
	#logo img{
		width:100%;
		height:auto;
	}
}

img[src*=".svg"] {
  width: 100%; 
}