html {		/*normalize.css*/
  font-family: sans-serif; /* 1 */
  -ms-text-size-adjust: 100%; /* 2 */
  -webkit-text-size-adjust: 100%; /* 2 */
}
body {
	/*	margin: 0;	normalize.css*/	
	max-width:1200px;	
	margin-left:auto;
	margin-right:auto}	
h1 {
	font-family: "Playfair Display";
	font-size:3em;
    font-weight:bold;
	margin-left:5%;
	margin-bottom:2.5%;
	-webkit-margin-before: 0.2em;
	margin-top:0.2em}
 @media (max-width: 420px) {
	h1 {
	font-size:2em;}
 }
h2, h3, h4, p, li {
	font-family: 'Source Sans Pro', sans-serif}
h2 {
	font-weight:300;
	font-size:1.8em;
	-webkit-margin-before: 0;
    -webkit-margin-after: 0;
	margin-top:0;
	margin-bottom:0}
h3{
	font-size:2em;
	font-weight:600;
	line-height:1.3;
	color:#5e607d;
	-webkit-margin-before: 0;
    -webkit-margin-after: 0;}	 
h4 {
	font-weight:300;
	font-size:1.4em;
	line-height:1.3;
	-webkit-margin-before: 0;
    -webkit-margin-after: 0;
	margin-top:0;
	margin-bottom:0}

.bildbox {
	padding-left:5%;
	padding-right:5%;
	padding-bottom:2%}
.img-responsive {
  display: block;
  max-width: 100%;
  height: auto}	
#section {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	align-content:space-between;
	margin-bottom:2%}
.textbox {
	-webkit-flex: 1 1 48.8%;
	flex: 1 1 48.8%;
	max-width:48.8%}
@media (max-width:425px) {
	.textbox { 
		-webkit-flex: 1 1 100%;
		flex: 1 1 100%;	
		max-width:100%;
		margin-left:1%;
		margin-right:1%;
		margin-top:1%;
		border-left:none;
		border-right:none}
 }
.rahmen-li {
	border: 1px solid;
	border-left:none}
.rahmen-re {
	border: 1px solid;
	border-right:none}
@media (max-width:425px) {
	.rahmen-li, .rahmen-re {
		max-width:100%;
		margin-left:1%;
		margin-right:1%;
		margin-top:1%;
		border-left:none;
		border-right:none}
}
.li {
	margin-right:1%}
.re {
	margin-left:1%}
.weiss {
	color:#ffffff}
.ueber {
	margin-top:-20%;
	margin-left:0;
	margin-right:0}
@media (max-width: 600px) {	
	 .ueber { 
		margin-top:-15%;
		font-size:0.8em;
		max-width:100%;
		margin-left:1%;
		margin-right:1%}
}
.content {
	padding-top:5%;
	padding-left:8%;
	padding-bottom:5%;
	padding-right:8%}
	
#kontakt .li-box {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-flex-flow:row wrap;
	flex-flow:row wrap;
	justify-content:center;
	align-content:space-around}
.fotobox {
	-webkit-flex: 1 1 15%;
	flex: 1 1 15%;
	max-width:100px;
	margin-left:1%; 
	margin-right:1%;
	margin-top:1%;
	margin-bottom:0.5%;
	padding-top:3%}	
#kontakt .li-box  img {
	transform: scale(0.9)}
#kontakt .li-box  p {
	font-size:0.8em;
	text-align:center;
	-webkit-margin-before: 0em;
	margin-top:0}

nav {	
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-flex-flow:row wrap;
	flex-flow:row wrap;
	justify-content:center;
	align-content:space-around;	
	margin-bottom:2%}
.navbox {
	-webkit-flex: 1 1 15%;
	flex: 1 1 15%;
	border: 4px solid lightgray;	
	box-shadow: 2px 2px 3px rgba(150,150,150,0.8);
	max-width:100px;
	min-width:80px;
	height:100px;
	margin-left:1%; 
	margin-right:1%;
	margin-top:1%;
	margin-bottom:0.5%;
}
 .navbox img {
	transform: scale(0.9);
}
.navbox a {
	text-decoration:none}	
 .navbox  p {
	-webkit-margin-before: 0em;
    -webkit-margin-after: 0.5em;
	margin-top:0;
    margin-after: 0.5em;
	font-weight:600;
	font-size:1em;
	line-height:0.8;
	color:black;
	text-align:center;	
}	
 @media (max-width: 640px) {
	.navbox  p {
		font-size:0.8em;
		line-height:0.4}
 }
.navbox.link:hover {
	border: 4px solid red;
	box-shadow: 2px 2px 5px rgba(100,0,0,0.6)
}
.navbox.akt {
background-color: lightgrey}

footer {
	background-color:#5e607d;
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-flex-flow:row wrap;
	flex-flow:row wrap;
	justify-content:space-between;
	align-content:space-between;	
	margin-top:1%}
footer p, footer a {
	color:#ffffff}	
footer .logo {
	-webkit-flex: 1 1 10%;
	flex: 1 1 10%;	
	max-width:110px;
	max-height:60px}
footer .logo  img{
	transform:scale(0.9);
	padding-top:12%}	
footer .link {
	-webkit-flex: 1 1 50%;
	flex: 1 1 50%;
	text-align:center}
footer .adr {
	-webkit-flex: 1 1 35%;
	flex: 1 1 25%}
@media (max-width: 710px) {
	footer .adr { 
		-webkit-flex: 1 1 100% ;
		flex: 1 1 100%;
		max-width:100%;
		padding-left:10px}
}