* {
	color: #3a0307;
	font-family: 'Open Sans', sans-serif;
	box-sizing: border-box;
}

body{
	margin: 0;
	width: 100%;
	line-height: 1.5em;
}

.button_primaer{
	color: white;
	font-weight: bold;
	padding: 1em 2em;
	display: inline-block;
	background-color: #b80916;
	text-decoration: none;
	cursor: pointer;
}

header {
	
}
header > div:first-child {
	background: #f0e5d9;
}
header > div:last-child {
	background: #fff;
	padding-top: 1em;
}

#header_oberteil{
	display: flex;
	justify-content: center;
	/*background-color: #e9e9e9;*/
	padding: 1em;
	width: 100%;
	max-width: 1280px;
	margin: auto;
	flex-direction: column; 
}
		#header_oberteil .logos{
			display: flex;
			justify-content: center;
			text-align: center;
		}
				#header_oberteil .logos img{
					width: 50%;
				}
		#header_oberteil .header_links{
			text-align: right;
		}		
				#header_oberteil .header_links a {
					display: inline;
					text-decoration: none;
					padding: 0 1em;
				}
				#header_oberteil .header_links a:not(:first-child) {
					border-left: 1px solid #3a0307;
				}

#header_unterteil{
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	margin: 1em 0;
	align-items: center;
	/*border-bottom: 10px solid #e9e9e9;*/
	/*padding-bottom: 1em;*/
	padding: 0 1.8em 1em 1em;
	width: 100%;
	max-width: 1280px;
	margin: auto;
}
		#header_unterteil>div{
			flex-grow: 1; 
			display: flex;
			align-items:center;
			justify-content: right;
			flex: 1 1 33.33333333%;
		}
				#header_unterteil .header_menu{
					justify-content: left;
				}
						#header_unterteil .header_menu #menu_wrap{
							display: inline-flex;
							align-items: center;
							cursor: pointer;
						}
								#header_unterteil .header_menu #menu_wrap img{
									margin-right: 1em;
									width: 1.4em;
								}
						
				#header_unterteil .suche{
					justify-content: center;
				}
						#header_unterteil .suche form{
							width: 60%;
						}				
						#header_unterteil .suche .suchleiste{
							position: relative;
						}
						
								#header_unterteil .suche .suchleiste .suche_input{
									height: 3em;
									width: 100%;
									border-bottom: none;
									border-right: none;
									border-left: 2px #bfbfbf solid;
									border-top: 2px #bfbfbf solid;
									border-radius: 2px;
								}
								#header_unterteil .suche .suchleiste input[type="submit"]{
									background-image: url(/images/layout/suche_icon.svg);
									background-color: transparent;
									background-size: contain;
									background-position: 50%; 
									background-repeat: no-repeat;
									border: none;
									position: absolute;			
									top: 0;
									right: 1em;
									width: 2em;	
									height: 100%;
								}
								
				#header_unterteil .header_rechts{
					flex-direction: column; 
					align-items: end;
				}								
						#header_unterteil .header_rechts .hinweis_versandkosten{
							display: flex; 
							align-items: center;
							font-style: italic;
						}
								#header_unterteil .header_rechts .hinweis_versandkosten img{
									width: 1.1em;	
									margin-right: 0.5em;
								}
						
						#header_unterteil .warenkorb a{
							display: flex;
							align-items: center;
							margin-left: 3em;
							position: relative;
							font-weight: 600;
							text-decoration: none;
						}
								#header_unterteil .warenkorb a img{
									width: 2em;
									margin-left: 1em;
								}
								#header_unterteil .warenkorb a .anz_artikel_wk{
									font-size:0.8em;
									background-color: #b80916;
									border-radius: 50%;
									width: 1.6em;
									height: 1.6em;
									display: flex;
									justify-content: center;
									align-items: center;
									color: white;
									position: absolute;
									left: 93%;
									bottom: 50%;
								}

.text {
	width: 90%;
	max-width: 1280px;
	margin: auto;
	padding: 0 0.5em;
}
.text form label {
	display: block;
	width: 100%;
	margin-bottom: 1em;
	margin-top: 1em;
}
.text form label small {
	display: block;
}
.text form input, .text form textarea {
	padding: 1em;
	display: block;
	width: 100%;
	resize: none;
	font-size: 1em;
}
.text form input[name="antispam"] {
	width: 5em;
}
.text form input[type="checkbox"] {
	width: auto;
}

/*
.text form input[name="plz"] {
	width: 5em;
}
.text form input[name="ort"] {
	width: calc(100% - 6em);
	margin-left: 1em;
}
.text form input[name="plz"], .text form input[name="ort"] {
	display: block;
	float: left;
}
*/
.text form input[type="submit"] {
	width: 15em;
	margin: 0 auto 1em auto;
	cursor: pointer;
}
footer {
	background-color: #f0e5d9;
	padding: 3em 0;
}
		.footer_oben, .footer_unten{
			display: flex; 
			justify-content: space-between;
		}
		.footer_oben{
			border-bottom: 1px solid #3a0307;
			padding-bottom: 1em;
			align-items: baseline;
		}
		.footer_unten{
			padding-top: 1em;
		}
				.footer_oben img, .footer_unten img{
					width: 6em;
					margin-left: 0.5em;
				}
		
		.footer_links{			
			
			line-height: 1em;
		}
		.footer_links:after {
			content: "";
			width: 100%;
			display: block;
			height: 0;
			visibility: hidden;
			clear: both;
		}
	
		footer a{
			text-decoration: none;
			padding: 0 0.75em;
			font-weight: bold;
			float: left;
			margin: 0.3em 0;
		}
		.footer_links a:not(.footer_links a:last-child){
			border-right: 2px solid #3a0307;
		}		

		.social_links{
			display: flex; 
			align-items: center;
		}
		
		#copyright_hinweis{
			font-size: 0.8em;
		}
		

		

#menu {
	display: none;
	position: fixed;
	width: 250px;
	height: 100%;
	background-color: #f0e5d9;
}

		.menu_item {
			cursor: pointer;
			width: 100%;
		}		
				.menu_ueberschrift{
					text-align: center;
					margin: 2em auto;
				}
						.menu_ueberschrift .hauptueberschrift{
							font-weight: 600;	
						}
				.menu_item a{
					display: block;
					padding: 0.3em 1em;
					margin: 0.3em 1em;
					border-bottom: 1px solid #3a0307;
					text-decoration: none;
					font-size: 0.9em;
					position: relative;
					display: flex;
					justify-content: space-between;
					align-items: center;
				}
						.menu_item .bez_rubrik::after, .menu_item .items_rubrik a::after{
							content: url(/images/icons/pfeil_kreis_weiss_rechts.svg);
						}			
						
						.menu_item.ausgeklappt .bez_rubrik::after{
							content: url(/images/icons/pfeil_kreis_rot_rechts.svg);
							transform: rotate(90deg);
						}
						.menu_item.ausgeklappt a:not(.bez_rubrik){
							padding-left: 2em;
						}
				.bez_rubrik{
					font-weight: 700;
				}
				.items_rubrik:not(.ausgeklappt .items_rubrik){
						display: none;
				}

		#main_black_overlay {
			display: none;
			position: absolute;
			width: 100%;
			min-height: 100%;
			background-color: #000;
			opacity: 0.5;
			z-index: 5;
			cursor: pointer;
		}

						
.cookiebanner{
	position: fixed;
	right: 1em; 
	bottom: 1em; 
	z-index: 9999;
	width: 700px;
	max-width: 100%;
	background-color: #e9e9e9;
	padding: 1em;
	display: none;
}
	.cookiebanner .button_primaer{
		margin: 0.5em;
	}
	.cookiebanner p{
		font-size: 0.9em;
	}

	@media (max-width: 800px) {
		.cookiebanner{
			left: 1em;
			right: 1em; 
			width: calc(100% - 2em);
		}
	}

		


@media (max-width: 800px) {
		#header_oberteil .header_links{
			display: none;
		}
		
		#header_unterteil .suche form{
			width: 95%;
		}
		#header_unterteil .warenkorb a{
			margin-left: 1em;
		}
				#header_unterteil .warenkorb a img{
					margin-left: 0.2em;
				}
				#header_unterteil .header_menu #menu_wrap img{
					margin-right: 0.2em;
				}
}

@media (min-width: 500px) and (max-width: 801px)  {
		#header_unterteil .header_rechts .hinweis_versandkosten{
				display: none; 
		}
}

@media (max-width: 500px) {
		body{
			padding-bottom: 4em; /*wird für die mobile Navigation gebraucht*/
		}
		#header_unterteil .header_menu, #header_unterteil .warenkorb, #header_unterteil .suche{
			display: none;
		}
		
				#header_oberteil .logos img{
						width: 65%;
				}

		 #header_unterteil{
			flex-direction: column;
		 }
				#header_unterteil .suche{
					width: 90%;
				}
						#header_unterteil .suche form{
							width: 100%;
						}		
								#header_unterteil .suche .suchleiste .suche_input{
									border: 2px solid #e9e9e9;
									border-radius: 1em;
									margin: 1em 0;
								}
								#header_unterteil .suche .suchleiste .suche_input:focus{
									outline: none;
								}
								#header_unterteil .suche .suchleiste input[type="submit"]{
									background-image: url(/images/layout/suche_icon.svg);
								}
		
		#navigation_mobil{
			height: 4em; 
			width: 100%;
			position: fixed;
			bottom: 0;
			display: flex;
			justify-content: space-around;
			align-items: center;
			background-color: #f0e5d9;
			box-shadow: 0px -3px 20px 5px rgba(0,0,0,0.75);
			z-index: 1;
		}
				#navigation_mobil>div, #navigation_mobil>div a{
					flex-grow: 1; 
					height: 100%;
					display: flex;
					align-items: center; 
					justify-content: center;
					cursor: pointer;
				}
						#navigation_mobil>div:not(#navigation_mobil>div:last-child){
							border-right: 2px solid #ffffff;	
						}
						#navigation_mobil>div img {
							width: 1.7em;
						}
						#navigation_mobil .shoplogo {
							background-color: #3a0308;
						}
		.text form input[type="submit"] {
			width: 100%;
		}

		footer{
			padding: 1em 0;
		}
		.footer_oben, .footer_unten{
			justify-content: center;
		}
			footer .footer_links{
				display: none;
			}		
			.footer_unten{
				flex-direction: column;
				text-align: center;
			}
				.footer_unten .social_links{
					justify-content: center;
					order: -1;
				}

}

@media (min-width: 501px) {
		#navigation_mobil {
			display: none;
		}
}









