html {
	margin: 0;
	padding: 0;
	font-family: 'Raleway', sans-serif;
	font-size: 16px; /* Basis-100 % */
	line-height: 1.5;
	color: #2b2a27;
}


@font-face {
  font-family: 'Open Sans';
  src: url('../fonts/Raleway-VariableFont_wght.ttf') format('ttf');
}

body {
	margin: 0 auto;
	padding: 0;
	max-width: 1300px;
}


h2 {
	font-weight: 400;
	font-size: 1.52941rem;
	padding: 2% 0 5% 0;
	margin: 0;
}

h3 {
	font-weight: 400;
	font-size: 1.32941rem;
	padding: 2% 0 5% 0;
	margin: 0;
}


a {
	color: #2b2a27;
	text-decoration: underline;
	
}

a:hover {
	color: #000000;
	text-decoration: none;
}

p {
	font-weight: 100;
	font-size: 1rem;
	line-height: 1.9rem;
	padding: 0;
	margin: 0;
}

img {
	padding: 0;
	margin: 0;
}

header h1 {
	padding: 3% 0;
	margin: 0;

}


header {

	padding: 0;
	margin: 0;
	border-bottom: 1px solid #a4a4a4;
}     


.logo {
	width: 40%;
	margin: 0 auto;
	display: flex;

}   


main {
	width: 100%;

}

section {
	width: 100%;
}

.grid3to1 {
	width: 100%;
}
.grid1to3, .intro, .normal {
	width: 88%;
	padding: 5% 6%;
	margin: 0;
}

.produkt {
	width: 48%;
	float: left;
	margin: 1% 1% 5% 1%;
	text-align: center;
	padding-bottom: 3%;

}
.produkt img {
	width: 100%;
}

.produkt h4 {
	font-weight: 600;
	font-size: 1.0rem;
	padding: 2% 2% 0 2%;
	margin: 0;
}

.produkt p, .produkt .preis {
	font-size: 0.9rem;
	padding: 0 2%;
	margin: 0;
	font-weight: 200;
}


footer {
	background-color: #e6e6e6;
	width: 92%;
	padding: 6% 4% 12% 4%;
	clear: both;
	
}

footer p {
	font-size: 1rem;
	text-align: center;
}


	

footer .svg {
	width: 35px;
}




/* @group My Group */

@media (min-width: 800px) {

h1 {
	padding: 2% 0 1% 0;
}

h2 {
	font-size: 1.88235rem;
	padding: 1% 0 1% 0;
}
h3 {
	font-size: 1.58235rem;
	padding: 1% 0 1% 0;
}

p {
	font-size: 1.29412rem;
}





.logo {
	width: 20%;
	display: flex;
	margin: 0 0 0 0;
	padding-left: 1%;;

}

.grid3to1, .grid1to3 {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.grid3to1 img,
.grid1to3 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  flex: 1;
}
.headerimage {
	height: 20%;
}


.intro {
	text-align: center;
	margin: 0 0 2% 0;
}

.normal {
	width: 96%;
	clear: both;
	display: block;
	padding: 0 2% 2% 2%;
}

.produkt {
	width: 23%;
	margin: 1% 1% 0% 1%;

}

footer {
	background-color: #e6e6e6;
	width: 88%;
	padding: 3% 6% 3% 6%;
	clear: both;
	
}


/* @end */