body{
	width: 100%;
	margin: 0;

}

@font-face {
    font-family: chirofontlight;
    src: url(./fonts/SourceSansPro-Light.woff);
    
    
}

@font-face {
	font-family: chirofontextralight;
   src: url(./fonts/SourceSansPro-ExtraLight.woff);	
	
}

@font-face {
	font-family: chirofontregular;
   src: url(./fonts/SourceSansPro-Regular.woff);
   
}

.telefon{
	color: black;
}

#content{
max-width: 1910px;
margin-left: auto;
margin-right: auto;
}

.navspacer{
height: 0px;
padding-bottom: 10.2%;
display: block;
position: relative;

}
.navspacerdisp
{
display: none !important;
}

#navicontainer{
	display: block;
	/*top:-2px;*/
	width: 100%;
	max-width: 1910px;
   max-height: 180px;
   z-index: 10;
   background-color: rgba(255,255,255,0.5);
}

.landscapescroll{
position: fixed;

}
/* watch > 1920px*/
.portraitscroll{
	position: relative;

}

#navi{
	
	width: 100%;
	height: 180px;
	
	padding-bottom: 0;
	background-color: rgba(11,68,203,0.5);
	
}

#logo{
	max-width: 9.5%;
	min-width: 9.5%;
	float: left;
	position: relative;
	background-image: url("bilder/grafik/logoneu.png");
	background-size: contain;
	height: 0;
	padding-bottom: 9.5%;
	
}
.imglogo{
	width: 100%;
   display: none;

}

#ueberschrift
{
	margin-top: 1%;	
	position: relative;
	display: block;
	width: 89%;
	float: left;
}

.ueberschrifttext{
	width: 100%;
	
}

/*adresseoben die Schriftgrösse mit dokumentgrössen fixen, ggf inline block auf block */
#adresseoben{       
	position: relative;
	display: block;
	/*clear: left;*/
	min-height: 30%;
	width: 80%;
	left: 2%
}

.adresseobentext{
	font-family: chirofontregular;
	font-size: 1.5vw;
	margin: 0 0 0 0;
}

.divadresse{
	float: left;
	z-index: 99;
	position: relative;
	display: block;
}

#contnavi{
	position: absolute;
	bottom: 0px;
	
	
   width: 100%;
   
}

#clicknavi {
    margin-left: auto;
    margin-right: auto;
    position: relative;
	 width:10%;  
	 min-width:150px;  
    /*max-width: 150px;*/
    color: white;
    font-size: 20px;
    padding-bottom: 5px;
    height: 25px;
    border-style: solid;
    border-width: 1px;
    border-radius: 15px 15px 15px 15px;
    padding-left: 10px;
    padding-top: 3px;
    padding-right: 10px;
    margin-bottom: 2px;
}

.clicknavi1{
	border-radius: 15px 15px 0 0 !important;
	padding-bottom: 7px !important;
	margin-bottom: inherit !important;
}

#clicknavi p{
	margin: 0;
	
}

#navilinks{
	position: relative;
	float:left;
	font-family: chirofontregular;
	margin-left: 10% !important;
   color: black;
   user-select: none;
   -ms-user-select: none;
}

#navirechts{
	position: relative;
	float: right;
	font-family: sans-serif;
	user-select: none;
	-ms-user-select: none;
}

#klappcont{    
	 position: fixed;
    visibility: hidden;
    z-index: 9;
    width: 100%;
    max-width: 1910px;
}

.klappcontvis{
    visibility: visible !important;
}


#klapphinter{
	background-color: rgba(11,68,203,0.5);
	padding-left: 0.5%;
   padding-right: 0.5%;
   border-radius: 0 0 15px 15px;
   border-style: none;
   padding-bottom: 1px;

}
#klapphinter a{
	text-decoration: none;
	color: black;
	font-family: chirofontregular;
	margin-bottom: 1px;
	font-size: 15px;
	display: block;
}

.naviscroll{
	 height: 300px;
    overflow-y: scroll;
    width: 12%;
    margin-left: auto;
    margin-right: auto;
    min-width: 192px;
    padding-left: 15px;
}

.naviklapp{
	margin-left: auto;
   margin-right: auto;
   position: relative;
   width: 11%;
   min-width: 172px;
   border-style: none solid solid;
   border-color: white;
   border-width: 1px;
   background-color: rgba(255,255,255,1);
   border-radius: 0 0 15px 15px;
   top: -2px;
}

ul{
	 margin: 0;
    list-style-type: none;
    margin-block-start: 0;
    margin-block-end: 0;
    padding: 0;
}

.klink{
	list-style-type: none;
	font-family: chirofontregular;
	margin-bottom: 2px;
	margin-top: 2px;
	padding-left: 12%;
	padding-right: 12%;
   border-bottom-style: solid;
   border-bottom-width: 1px;
   border-color: white;
   padding-top: 2px;/*neu*/
   padding-bottom: 1px;
}

.klinkactive{
	background-color: rgba(128,199,128,0.5) !important;
}


.firstnavi{

}

.lastnavi{
	 border-radius: 0 0 15px 15px !important;
    border-style: none !important;
    /* margin-top: 2px; */
    margin-bottom: 0 !important;
}

#scroller{
	width: 100%;
	height: 20%;
	overflow: hidden;
}

.scrollcontainer{
	display: block;
	position: relative;
	width: 500%;
	
	overflow: hidden;
}

.imgscr{
	width: 20%;
	height: 100%;
	display: flex;
   float: left;
}

@keyframes scrollani {
	0% {transform: translatex(0);  }
	22% {transform: translateX(0); }
	25% {transform: translateX(-20%);}
	47% {transform: translateX(-20%); }
	50% {transform: translateX(-40%);}
	72% {transform: translateX(-40%); }
	75% {transform: translateX(-60%);}
	97% {transform: translateX(-60%); }
	100% {transform: translateX(-80%);}
	}
	
.scrollkey{
	 
    -webkit-animation: scrollani 20s 1; /* Safari 4.0 - 8.0 */
    animation: scrollani 20s;
    /*will-change: transform;*/
    animation-timing-function: ease;
    animation-iteration-count: infinite;
}

.delay1{
	animation-delay: 5s;
}

.anchor{
    display: block;
    position: relative;
    top: -170px;
    visibility: hidden;
}

.text{
	
	font-family: chirofontlight;
	/*font-size: 1.8vw;*/
	font-size: 1.5vw;
}

.textganz{
	width:85%;
	
	padding-left: 7.5%;
	padding-right: 7.5%;

}

.textlinks{
	/*text-align: center;*/
	width:35%;
	float: left;
	padding-left: 7.5%;
	padding-right: 7.5%;

}

.textrechts{
	/*text-align: center;*/
	width:35%;
	float: left;
	padding-left: 7.5%;
	padding-right: 7.5%;
}

.textganz h3{

	text-align: center;
	color: rgba(12,127,23,1);
	font-weight:bold;	
	font-size: 1.8vw;

}

.textlinks h3 {
	
	color: rgba(12,127,23,1);
	font-weight:bold;	
	font-size: 1.8vw;
	margin-top: 0;
	
	}
	
.textrechts h3 {
	color: rgba(12,127,23,1);
	font-weight: bold;
	font-size: 1.8vw;
	margin-top: 0;
		
	}

.textmitte{
	text-align: center;
}

.linkimtext, .linkimtext:active, .linkimtext:hover, .linkimtext:visited{
	font-family: chirofontlight;
	color: black;
	width: 93%;
}

.linkimtextbeschreibung{
margin-top: 0;
}

.bildganz {

	width: 100%;
	float: none;
}
	
.bildlinks{
	width: 40%;
	padding-left: 7.5%;
	padding-right: 2.5%;
	float: left;
}

.bildlinks img{
	width: 100%;
}

.bildrechts{
	width: 40%;
	padding-left: 2.5%;
	padding-right:7.5%;
	float: right;
}

.bildrechts img{
	width: 100%;
}

.bildimtextrechts{
	float: right;
	width: 15%;
}

.overlay{
	 top: 0px;
    left: 0px;
    position: absolute;
    float: left;
}

.mann{
	width: 30% !important;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	display: block;
}

.mannliste{
	padding-left: 0;
}

.mannbutton{
	font-size: smaller;
	list-style-type: disc;
	cursor: pointer;
	border-bottom: 1px solid black;
}

.hinweis{
	margin: 0;
	font-size: smaller;
}

.marginbildundtext{

	margin-bottom: 2%;
}

.team{
	margin-left: 7.5%;
	margin-right: 7.5%;
}

.teambild{
	width: 15%;
	float: left;
}

.teambildlinks{
	float: left;
	width: 100%;
}

.teambildrechts{
	float: right;
	width: 100%;
}

.teamtextlinks{
}

.teamtextrechts{
	float: left;
	width: 70%;

}

.karte{
	
}

.parallax{
	width: 100%;
	margin-top: 1%;
	margin-bottom: 1%;
}

.parallax img{
	width: 100%;
	
}

#totop{
	display: block;
	position: fixed;
	bottom: 10px;
	width: 35px;
	height: 35px;
	float: right;
   border-style: solid;
   border-color: rgba(11,68,203,0.5);
   border-width: 2px;
   border-radius: 9px;
   right: 10px
   
}

#topimg{
	height: 100%;
	display: block;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	opacity: 0.5;
}

#footer{
	width: 100%;
	height: 10%;
	min-height:300px;
	background-color: grey;
}

.footercontent{
	max-width: 400px;	
	min-width: 300px;
	margin-left: auto;
	margin-right: auto;
	height: 200px;
	text-align: center;
	padding-top: 50px;
}

.footertext{
	font-family: chirofontregular;
	color: white;
	font-size: 17px;
}

.footerlink{
	text-decoration: none;
	color: white;
}

.footerlinklinks{
	width: 47.5%;
	display: inline;
	position: relative;
	float: left;
}

.footerlinkrechts{
	width: 47.5%;
	display: inline;
	position: relative;
	float: left;
}

.footerlinkmitte{
	width: 5%;
	display: inline;
	position: relative;
	float: left;
}
.footerlinkmitte p, .footerlinklinks p, .footerlinkrechts p{
	margin: 0;

}
.footerdesc{
	text-align: center;
	font-family: chirofontlight;
	font-size: 17px;
	color: white;
	margin-top: 25px;

}

.footerdesc p{
	margin: 0;
}

.footercolor{
	color: white !important;
}

.mail{
	text-decoration: none;
	color: white;
	
}

@media screen and (min-width:1910px){
	
	.adresseobentext{
		font-size: 25px;
	}
	
.text{
	font-size: 29px !important;
	}
	
.textlinks h3, .textrechts h3, .textganz h3{

	
	font-size: 35px !important;
	/*font-weight: bold;*/
	
	}
	
/*.anchor{
	top: -110px;
	}
*/
}

@media screen and (min-width: 1401px){
	#navi{
	
	width: 100%;
	height: 140px;
	
	padding-bottom: 0;
	background-color: rgba(11,68,203,0.5);
	}
	
	#logo{
	width:132px;
	height:132px;
	padding: 0;
	max-width: 132px;
	min-width: 132px;
	}
	
	.navspacer{
	height: 140px;
	padding-bottom:0;
	display: block;
	position: relative;

	}
	
	.anchor{
	top: -140px;
	}
	
}


@media screen and (max-width: 1400px){
	#navi{
	width: 100%;
	height: 100px;
	padding-bottom: 0;

	}
	
.navspacer{
	height: 100px;
	padding-bottom:0;
	display: block;
	position: relative;

	}
	
#logo{
	width:92px;
	height:92px;
	padding: 0;
	max-width: inherit;
	min-width: inherit
	}
	
#ueberschrift{
	float:left;
	width: 79%;
   position: inherit;
   display: inherit;

	}	
	.anchor{
	top: -100px;
	}
}

@media screen and (max-width: 1300px){
	#clicknavi{
	font-size: 15px;
	height: 20px;
	
	}

}

@media screen and (max-width: 1000px){
	#adresseoben{
	width: 90%;
	
	}
	
.adresseobentext{
	font-size: 15px;
	}
	
.anchor{
	top: -110px;
	}
	
#clicknavi{
	font-size: 15px;
	height: 20px;
	
	}
}

@media screen and (max-width: 975px){
#navi{
	width: 100%;
	height: 100px;
	padding-bottom: 0;

	}
	
.navspacer{
	height: 100px;
	padding-bottom:0;
	display: block;
	position: relative;

	}
	
#logo{
	width:92px;
	height:92px;
	padding: 0;
	max-width: inherit;
	}
	
#ueberschrift{
	float:left;
	width: 79%;
   position: inherit;
   display: inherit;

	}

}

@media screen and (max-width:700px){
.anchor{
    display: block;
    position: relative;
    top: -100px;
    visibility: hidden;
	}

.textlinks{
	float: none;
	width: 85%;
	padding-right:7.5%;
	padding-left: 7.5%; 
	}

.textrechts{
	float: none;
	width: 85%;
	padding-right:7.5%;
	padding-left: 7.5%; 
	}
	
.textrechts h3, .textlinks h3, .textganz h3{
	font-size: 22px;
	text-align: center;

	}
	
.mannliste{
	padding-left: 7.5%;
}

.bildlinks{
	float: none;
	width: 85%;
	padding-right:7.5%;
	padding-left: 7.5%; 
	}

.bildrechts{
	float: none;
	width: 85%;
	padding-right:7.5%;
	padding-left: 7.5%; 
	}

.bildimtextrechts{
	width: 25%;
	min-width: 97px;
	}
	
.text{
	font-size: 16px;
	}

#totop{
	width: 25px;
	height: 25px;
	}
	
.teambild{
	width: 25%;
	min-width: 110px;

	}

.karte{
	margin-left: -4.5%;
	}

}

@media screen and (max-width: 500px){
#logo{
	width: 70px;
	height:70px;

	}
}

@media screen and (max-width: 431px){
.teamtextrechts{
	width: 100%;
	
	}

}

@media screen and (max-width: 385px){
	
}
@media screen and (max-width: 350px){
#logo{
	top:20px;
	}

#ueberschrift{
   position: absolute;
   display: block;	
	float:left;
	width: 100%;

	}
	
#adresseoben{
	position: relative;
	display: block;
	min-height: 20px;
	top: 25px;
	}
	
.adresseobentext{
	font-size: 15px;
	
	}
	
	.anchor{
	top: -100px;	
	}
}
@media screen and (max-height: 390px)
{
	#klapphinter a
	{
		font-size:11px;
	}
}