/* Allgemeine Styles */
*{
	box-sizing:border-box;
	margin: 0;
	padding: 0;

}



@font-face {
	font-family: "Ubuntu";
	src: url(Ubuntu-Regular.ttf);
}


body{
	margin:0;
	padding: 0;
	height: 100vh;
	font-family: "Ubuntu";
}
header{
	
	background: #004d98;
	font-size:2.5vh;
	border: 4px solid white;
	position:fixed;
	top:0;
	width:100%;
	z-index:1;
	
}

/* Allgemein Font-Einstellungen und Buttons */
h1 {
	font-size: 8vw;
	color: white;
	font-family:"Ubuntu";
	font-weight:bold;
	font-style:italic;
	background-color:none;
}
h2{
	font-size: 4.5vw;
	color: #004d98 ;
	font-family: Ubuntu;
	font-weight-bold;
	background-color:none;
	margin-bottom:3%;
}
h3{
	font-size: 2.75vh;
	color: #004d98 ;
	font-family: Ubuntu;
	font-weight-bold;
	background-color:none;
}
h4{
	font-size: 3vh;
	color: #ee7415;
	font-family:Ubuntu;
	font-weight:bold;
	background-color:none;
	margin-top:1%;
}
h5{
	font-size: 3vh;
	color: #004d98;
	font-family:Ubuntu;
	font-weight:bold;
	background-color:none;
	margin-top:1%;
}
h6{
	font-size: 3vw;
	color: #004d98;
	font-family:Ubuntu;
	font-weight:bold;
	background-color:none;
	margin-top:1%;
}
h7{
	font-size: 2vw;
	color: black;
	font-family:Ubuntu;
	background-color:none;
	margin-top:1%;
}
button{
	padding: 9px 25px;
	background-color:#004d98;
	border:none;
	border-radius: 50px;
	cursor:pointer;
	transition: all 0.3s ease 0s;
	font-family:"Ubuntu";
	font-weight:500;
	font-size: 4vw;
	color: #004d98;
	text-decoration:none;
	margin-bottom:5px;
}
.sponserbutton{
	
	bottom: 5%;
	right: 5%;
	position:fixed;
	z-index:5;
	
}
.sponserbuttonprops{
	color: white;
	font-size:2vw;
}
.sponserbuttonprops:hover{
	background-color:#004d98;
	color:#ee7415;
	
}
button:hover {
	background-color:#ee7415;
}
#button2{
	font-family:"Ubuntu";
	font-weight:100;
	font-size:2vw;
	color:white;
	margin-top:4%;
}
#marginleftforimage{
	margin-left:30%;
	width:20%;
	height:auto;
	margin-right:10%;
	min-height:202px;
	mein-width:243px;
}
#zitat{
	font-size:5vh;
	color:white;
	font-family:"Ubuntu";
	font-weight:bold;
	font-style:italic;
	text-align:center;
}
#zitatdiv{
	padding-bottom:2%;
	padding-top:2%;
	background-color:#004d98;	
}
#largerdiv{
	padding-bottom:2%;
	padding-top:1%;
	background-color:  #e9e9e9 ;
}
	

p{
	font-family:Ubuntu;
	font-size: 2vh;
	background-color:none;
	
}
/* Navigation Bar*/
header ul{
	
	margin: 0 auto;
	padding: 0;
	list-style:none;
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	align-items:center;
	text-align:left;
	margin-right:2%;
	
}

header ul li{
	list-style:none;
	position:relative;
	align-items:center;
	padding: 10px 10px;
	transition:0.5s;
	
}
header ul li:hover{
	background:#2196f3;
}
header ul li:hover ul{

	opacity:1;
	visibility:visible;


}
	
header ul li a{
	text-decoration:none;
	padding: 0 5px;
	color: #fff;
}
header ul li ul{
	position:absolute;
	background-color:#004d98;
	color:white;
	top:58px;
	left:0;
	display:block;
	width:146%;
	transition:0.5s;
	opacity:0;
	visibility:hidden;
}
header ul li ul li{
	border-right:none;
	color:white;
	width:100%;
	
}

#box_heading{
	
}
#box_content{
	
	display:block;
	
}
#box_content.hide{
	display: none;
	background-color:green;
}
#box_heading2{
	
}
#box_content2{
	
	display:block;
	
}
#box_content2.hide{
	display: none;
	background-color:green;
}
#box_heading3{
	
}
#box_content3{
	
	display:block;
	
}
#box_content3.hide{
	display: none;
	background-color:green;
}
#box_heading4{
	
}
#box_content4{
	
	display:block;
	
}
#box_content4.hide{
	display: none;
	background-color:green;
}


/* Dropdown Menu Navigation Bar*/
.block{
	display:none;
	
}
label{
	padding-top:200px;
	margin: 40 40 40 40px;
	font-size:10vh;
	line-height:70px;
	cursor:pointer;
	color:white;
	
}
#toggle{
	display:none;
}
/* Navigation Bar Style-einstellungen*/
#startnavbar{
	max-width:200px;
}	

#endnavbar{
	display:flex;
	flex-direction:row;
	justify-content: flex-end;
}
#abstandzurnav{
	margin-top:100px;
}
#active{
	color: #ee7415;
}	
/* Image Styles*/
.logo{
	cursor:pointer;
	width:40%;
	min-width:150px;
	min-height:auto;	
}
.responsive {
	width: 100%;
	height: auto;
}
.responsive2 {
	max-width:40%;
	height: auto;
}

#balken{
	width:20%;
	height:auto;
}
#galeriebilder{
	width:30%;
	height:auto;
    max-width: 768px;
    max-height: 1024px;
	
}
#galerieabstand{
	margin: 0.125%;
	
}
 

/* Zentrierungen*/
.center_image{
	display:block;
	margin-left: auto;
	margin-right:auto;
	width:30%;
	height:auto;
	
}

.center_text{
	text-align:center;
	transition: all 0.3s ease 0s;	
	

}
.center_textfield{
	text-align:center;
	display:block;
	margin-left: auto;
	margin-right:auto;
	width:70%;
	margin-top: 1%;
	
}

.faktenliste{
	margin-left:6%;
	font-family:Ubuntu;
	font-size: 2vh;
	background-color:none;
}
.faktenliste li ul{
	margin-left:5%;
}

/* Timeline Spezifikationen */

.timeline_textfield{
	
	width:100%;
	text-align:center;
	
	
}
.timeline_list{
	font-family:Ubuntu;
	font-size: 2vh;
	background-color:none;
}
#plaenetextfield{
	width:60%;
	
	font-size: 2vh;
	
	
}


/* Flex-Row Ausrichtungen */


.flex-row{
	display:flex;
	flex-direction:row;
	justify-content: center;
	
	
}
.flex-row-for-calender{
	display:flex;
	flex-direction:row;
	justify-content:center;
	
}
.flex-row > div{
	margin: 2% 4%;	
	max-width:20%;
	
}
.flex-row> img{
	margin-left: 0%;
}
.flex-row > div > img{
	width:100%; 
	height:auto;
	
}
.flex-row > div > p{
	font-family:Ubuntu;
	font-size: 2vh;
	background-color:none;
	text-align:center;
	color: black;
}
.flex-row > div > h4{
	background-color:none;
	text-align:center;
	color: #ee7415;
	margin-bottom:1%;
}

.flex-row-for-headline{
	display:flex;
	
	justify-content: center;
	align-items:center;
	
}

.flex-row-for-headline > div >img{
	width:100%;
	height:auto;
	
}

.flex-row-with-image{
	display:flex;
	flex-direction:row;
	justify-content: flex-start;
}

/*Galerie*/
.flex-row-galerie{
	display:flex;
	flex-direction:row;
	justify-content:center;
}
.flex-row-galerie>img{
	margin:0.125%;
}

#balken{
	margin-top:-3%;
}


/* Bilder Neben Text (unverwendet) */
.imagenexttotext{
	display:flex;
	flex-direction: column;
	justify-content:center;
	margin-left:25%;
	
}
#imagetimeline{
	margin-top:1%;
	margin-right:2%;
	max-width:400px;
	width:5%;
	max-height:auto;
}
.imagenexttotext > div{
	margin-top:2%;
	margin-right:10%;
	display:flex;
	flex-direction: row;
	justify-content:center;
	max-width:100%;
	
	
}
.imagenexttotext > div > img{
	margin-top:1%;
	margin-right:2%;
	max-width:400px;
	width:60%;
	max-height:auto;
	
}
#specialimage{
	width:80%;
	height:auto;
}

/*Icon/ BienenBild neben Text */

.imagenexttotext > div > div {
	display:flex;
	flex-direction: column;
	
	
}
.iconnexttoimage{
	margin-left:5%;
}
.iconnexttoimage>div{
	display:flex;
	flex-direction:row;
	justify-content: flex-start;
	align-items:center;
	width:80%;
	margin-left:10vw;
	
	
}
.iconnexttoimage>div >div{
	display:flex;
	flex-direction:column;
	justify-content: flex-start;
	align-items:bottom;
	width:100%;
	
}
.iconnexttoimage>div>img{
	min-width:63px;
	min-height:63px;
}


/*Media Screen Settings */

@media screen and (max-width: 1050px) {

  .flex-row {
	flex-direction: column;
  }
  .flex-row > div > img{
	width:90%;
	margin-left:5%;
	
  }  
.flex-row > div{
	max-width:100%;
}
.flex-row > img{
	width: 90%;
	padding-left:10%;
	margin-top:2.5%;

}
header ul li ul{
	display:block;
}
@media only screen and (max-width: 1050px) {

/*Allgemeine Mobile Settings */

.center_image{	
	width:70%;
	height:auto;
	
}

header{
border: 4px solid white;
}
h2{
	font-size: 4.5vh;
}
h6{
	font-size:3vh;
}
h7{
	font-size:2vh;
}

#button2{
	font-family:"Ubuntu";
	font-weight:100;
	font-size:1.5vh;
	color:white;
}
#nomargin{
	margin-left:0%;
}

/*Navigation Bar Styling Mobile  */

.logo{
	display:none;
}
.block{	
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	
}
.checked
{
	width:100%;
	display:none;
}
.checked2
{
	width:100%;
	visibility:visible;
}
#toggle:checked ~ .checked{
	display:block;
}
#logoinnav{
	width:100%;
	max-width:200px;
	
}
#endnavbar{
	display:block;

}



/* Mobile Dropdown Settings */
#box_heading{
	
}
#box_content{
	
	display:block;
	
}
#box_content.hide{
	display: none;
	background-color:green;
}

#box_indicator{
	float:right;
	width:0px;
	height:0px;
	
	display:block;
	border-top:10px solid transparent;
	border-right:10px solid transparent;
	border-bottom:10px solid white;
	border-left:10px solid transparent; 

}

#box_indicator.hidden{
	border-bottom:10px solid transparent;
	border-top:10px solid white;
	margin-top:10px;
}
#box_indicator2{
	float:right;
	width:0px;
	height:0px;
	
	display:block;
	border-top:10px solid transparent;
	border-right:10px solid transparent;
	border-bottom:10px solid white;
	border-left:10px solid transparent; 

}

#box_indicator2.hidden{
	border-bottom:10px solid transparent;
	border-top:10px solid white;
	margin-top:10px;
}


#box_indicator3{
	float:right;
	width:0px;
	height:0px;
	
	display:block;
	border-top:10px solid transparent;
	border-right:10px solid transparent;
	border-bottom:10px solid white;
	border-left:10px solid transparent; 

}

#box_indicator3.hidden{
	border-bottom:10px solid transparent;
	border-top:10px solid white;
	margin-top:10px;
}
#box_indicator4{
	float:right;
	width:0px;
	height:0px;
	
	display:block;
	border-top:10px solid transparent;
	border-right:10px solid transparent;
	border-bottom:10px solid white;
	border-left:10px solid transparent; 

}

#box_indicator4.hidden{
	border-bottom:10px solid transparent;
	border-top:10px solid white;
	margin-top:10px;
}

/*Mobile Navigation Bar Definitionen */

header ul{
	display:block;
	text-align:center;
	background-color:#004d98;
}
header ul li{
	cursor:pointer;
}
header ul li a{
	text-align:center;
	color:white;	
	
}
header ul li ul{
	display:block;
	text-align:left;
	width:100%;
	margin-left:0;
	z-index:100;
	top:44px;
	text-align:center;
	background-color:white;
	border: 8px solid #004d98;
	visibility:visible;
	opacity:1;
		
}

header ul li ul li a{
	color:#004d98;
}

/* Image next to Text Mobile */

.imagenexttotext{
	display:flex;
	flex-direction: column;
	justify-content:center;
	margin-left:10%;
	
}
.imagenexttotext > div > img{
	margin-top:1%;
	
	width:95%;
	max-height:100%;
	
}
.imagenexttotext > div{
	display:flex;
	flex-direction: column;
	justify-content:center;
  }
/*Icon / Bienenbild next to text Mobile */
.iconnexttoimage>div>img{
	
	width:20%;
	min-width:20%;
	

}
.iconnexttoimage>div{
	
	margin-left:0%;
}
.iconnexttoimage>div>div>p{
	
	margin-left:30%;
	width:120%;
	
}

/*Spezielles Textfeld Mobile */
#plaenetextfield{
	width:100%;
	
	font-size: 2vh;	
}
/*Flex-Row Mobile Settings */
.flex-row {
	flex-direction: row;
	
	align-items:center;
	
  }
  .flex-row > div > img{
	width:30%;
	margin:0%;
	
	
  }  
.flex-row > div{
	max-width:100%;
	margin:0%;
}
.flex-row-with-image{
	display:flex;
	flex-direction:column;
	justify-content: flex-start;
}
/*Galerie*/
.flex-row-galerie{
	flex-direction: column;
}
.flex-row-galerie>img{
	width: 90%;
	padding-left:10%;
	margin-top:2.5%;
}
#galeriebilder{
	width:90%;
	height:auto;
	margin-bottom:2%;
}

#marginleftforimage{
	display:block;
	margin-left: auto;
	margin-right:auto;
	width:80%;
	height:auto;
	margin-top:5%;
	margin-bottom:5%;
	
}
.sponserbuttonprops{
	
	font-size:2vh;
}