﻿/*css für Imkerpage*/
	

body{
color: rgb(43,113,129);
font-size:100%;
/*background-color:rgb(208,127,36);*/
background-image: linear-gradient(to bottom, #EEDDAA 0%,#DCA533 100%);
margin:0;
padding:0;
/*color:rgb(92,42,14);*/
}
section {

    background-color:rgb(220,165,51); 
   /*background-color:rgba(232,202,65,0.5);*/
	margin:25px auto;
	max-width:90%;
	/*height: 1120px;*/

}

header{
	height: 80px;
	max-width: 90%;
	Margin: 20px auto;
	padding: 20px 0px 0px 20px;
	background-image:url(../img/banner.jpg);
	border-radius: 60px 0px 60px 0px;
	margin-bottom:0px;
	background-size:cover;
}

#banner p{
	margin: 5px auto;
	padding:5px 0px 5px 50px;
	background-color:rgba(245,245,220,0.9);
	border-radius: 60px 0px 60px 0px;
	font-size: 36px;
	font-weight:bold;
	max-width: 350px;
	
}	
#oben{
	width: 90%;
    margin:10px auto 0 auto;
	height:30px;
}

#oben ul{
	list-style-type:none;
	

}
#oben li {
    /*color: rgba(255,172,3,0.5);*/
	background-color:rgba(245,245,220,0.7);

	margin:-7px 20px 5px 15px;
	padding: 10px;
	border-radius: 60px 0px 60px 0px;
	text-align:center;
	flex-grow:1;

	flex-basis: 25%;
}


#links h4{
 margin-bottom: 5px;
}
.flex{
	display:flex;
	flex-wrap: wrap;
	flex-direction:row;
}
#links{ 
	/*max-width: 15%;
	min-width:150px;
	height: 580px;*/
	margin:  60px 10px 50px 20px;
	padding: 0px 20px;
	border-radius: 60px 0px 60px 0px;
	background-color:rgba(245,245,220,0.7);
	/*float:left;*/
	flex-grow:100;
	flex-shrink:1;
	flex-basis:10%
}

#links img{
	max-width:350px;
    height:auto;}

#impressumlinks{ 
	width: 190px;
	/*height: 690px;*/
	margin:  60px 10px 50px 50px;
	padding: 80px 20px;
	border-radius: 60px 0px 60px 0px;
	background-color:rgba(245,245,220,0.7);

}
#links ul  {
	margin:0;
	padding: 10px;
}
#links ul li  {
	list-style:none;
	flex-shrink:1;
}
#content{
	/*height: 580px;*/
	/*width: 540px;*/
	margin: 60px 10px 50px 10px;
	padding: 0px 20px;
	border-radius: 60px 0px 60px 0px;
	background-color:rgba(245,245,220,0.7);
	flex-basis:40%;
	flex-shrink: 1;
	flex-grow: 1
}
/*#together{
	font-size:14px;
	margin: 60px 10px 50px 10px;
	padding: 0px 40px;
	border-radius: 60px 0px 60px 0px;
	background-color:rgba(245,245,220,0.7);
	flex-basis: 70%;
        flex-grow: 100;
	flex-shrink:1;
	
}*/
#togetherhonig{
	font-weight:bold;
	/*height: 580px;*/
	
	margin: 60px 10px 50px 10px;
	padding: 0px 10px;
	border-radius: 60px 0px 60px 0px;
	background-color:rgba(245,245,220,0.7);
	flex-basis: 60%;
  	flex-shrink: 1;
    	flex-grow: 100;
    padding-left: 50px;
}
#togetherhonig td {
    padding: 10px 0;
    
}


#content th td{
	padding-right: 20px;
	
}
	
#rechts{
	/*height: 580px;*/
	
	margin: 60px 20px 60px 10px;
	padding: 0px 20px;
	border-radius: 60px 0px 60px 0px;
	background-color:rgba(245,245,220,0.7);
	
		flex-shrink:1;
}	
		
aside{
    width: 230px;
	
	margin: 100px 10px 100px 10px;
	padding: 30px 30px;
	border-radius: 60px 0px 60px 0px;
	background-color:rgba(245,245,220,0.7);

}

footer {
	width: 90%;
	
}	

footer ul {
    list-style-type:none;
	width: 100%
}

	
footer li{
	
	background-color:rgba(245,245,220,0.7);
	width: 210px;
	margin:-7px 20px 5px 15px;
	padding: 10px 0px;
	border-radius: 60px 0px 60px 0px;
  	text-align:center;
	margin-bottom: 10px;

	flex-shrink:1;
	flex-grow:1;
  	
}
#unten ul li{
	margin-top: 10px;
}




@media only screen and (max-width: 1080px)  {
	section{
		padding-top:20px;
	}
	#banner p{
		font-size:120%;
		padding: 20px;
		max-width:200px;
	}
	#links{
		margin-top: 20px;
		padding:20px 10px;
		flex-basis: 10%;
    		flex-grow: 100;
		
	}
	#rechts{
		
		margin-top:0px;
		padding-bottom:20px;
		flex-basis:100%;
		padding:20px 10px;
	}
	#content{
		flex-basis:60%;
		padding:20px 10px;
		}
		
	#together, #togetherhonig{
		flex-basis:65%;
		margin-top: 0px;
		padding:20px 10px;
	
	}
}	
	
	
@media only screen and (max-width: 950px)  {
	#banner{
	width: 100%;
	}
	#links, #impressumlinks{
		max-width:92%;
		flex-basis:100%
		
	}
	#links h2{
		
		Justify-content:center;
		text-align:center;
		flex-basis:100%
		
	}
	
	#links img, #impressumlinks img{
	display:block;
	margin: 10px auto;
	height:auto;
	max-width: 540;
	padding:10px;
	}
	#rechts{
		/*width:100%;*/
		margin-top:0px;
		flex-basis:100%
	}
	#content,#together, #togetherhonig{
		flex-basis:65%;
		margin-top: 0px;
	
	}
	
	#content,#together, #togetherhonig{
		flex-basis:95%;
		margin-top: 0px;
	
	}
	
	
@media only screen and (max-width: 360px){
	#oben li {
		margin-left: 0px;
		margin-right: 0px;
	}
	#oben  {
		margin-left: 0px;
		margin-right: 0px;
	}
	
	#unten li{
		justify-content:flex-start;
	}
}

