
body {
	margin-left:auto;	
	margin-right:auto;
	max-width:1000px;
}	

img {		
	margin-bottom:0%;
	margin-top:3%;	
}

h2, h3,.txt3, .txt4, .txt4b, .txt5 {
	font-family: "Roboto", sans-serif;
	hyphens: auto; }

h1{
	font-family: "Playfair Display";
	color: black;
	font-size:5.5vw;
	font-weight:700;
	line-height:1.0;
	margin-top:2%;
	text-align: center;
}
@media only screen and (min-width: 1000px) {	
  h1 {
     font-size: 55px;
  }
}
h2{
	color: #D2335B;
	font-size:4.2vw;	
	font-weight:700;
	line-height:1.0;
	text-align: center;
	margin-top: -2%;
}	
@media only screen and (min-width: 1000px) {	
  h2 {
     font-size: 42px;
  }
}

h3 {
	color:black;	
	font-size:3.0vw;
	font-weight:700;
	line-height:1.2;
	hyphens: none;
	margin-top: 4%;
	margin-left: 1%;
	margin-bottom: 0;
}
@media only screen and (min-width: 1000px) {	
  h3 {
     font-size: 30px;
  }
}

.txt3 {
	color:#D2335B;	
	font-size:3.0vw;
	font-weight:700;
	line-height:1.2;
	hyphens: none;
}
@media only screen and (min-width: 1000px) {	
  .txt3 {
     font-size: 30px;
  }
}
@media only screen and (max-width:650px){
	.txt3::after {
		content: "•";
	}
}
.txt4 {
	color:#5e607d;	
	font-size:2.2vw;
	font-weight:400;
	line-height:1.3;
}
@media only screen and (min-width: 1000px) {	
  .txt4 {
     font-size: 22px;
  }
}

.txt5 {
	color:#5e607d;	
	font-size:2.2vw;
	font-weight:400;
	line-height:1.3;
}
@media only screen and (min-width: 1000px) {	
  .txt5 {
     font-size: 22px;
  }
}
.itxt5 {
	color:#5e607d;	
	font-family: "Roboto Condensed", sans-serif;
	font-size:2.2vw;
	font-weight:400;
	line-height:1.3;
}
@media only screen and (min-width: 1000px) {	
  .itxt5 {
     font-size: 22px;
  }
}
.contentZeile {
	display: -webkit-flex;    
	display: -ms-flexbox;
	display: flex;
	margin-bottom: 2%;
	margin-left: auto;
	margin-right: auto;
	margin-top:0%;
	width: 95%;	
}
@media only screen and (max-width: 650px) {
	.contentZeile {
		display: block;
		margin-top:0;
	}
}

.mittenBox {
    -ms-flex: 1 1 50%;
    flex-basis: 50%;
    flex-grow: 1;
	width: 50%;
}
@media only screen and (max-width: 650px) {
    .mittenBox {
		flex: 1 1 95%;
		margin-left: auto;
		margin-right: auto;
		width: 95%;
}
}

.aufzLinks {
    -ms-flex: 1 1 25%;
    flex-grow: 1;
	margin-right:2%;
}
@media only screen and (max-width: 650px) {
    .aufzLinks {
		flex: 1 1 100%;			
		margin-bottom:1%;
		text-align: center;	
		width: 100%;
}
}

ul {
	margin:0;
	padding:0;	
}
@media only screen and (max-width:650px){
	ul::after {
		content: "•";
	}
}

.aufzLinks li, .aufzRechts li{
		list-style-type:none;
}		
@media only screen and (max-width: 650px) {
    .aufzLinks li, .aufzRechts li{
		list-style-type:none;
		display: inline;
}
}

.aufzRechts {
    -ms-flex: 1 1 25%;
    flex-basis: 25%;
    flex-grow: 1;
	margin-left:1%;
	text-align: right;
	width: 25%;
}
@media only screen and (max-width: 650px) {
    .aufzRechts {
		flex: 1 1 90%;
		flex-flow: row nowrap;
		flex-direction: row;
		margin-left: 0%;
		margin-top:1%;
		text-align: center;
		width: 90%;
}
}

.rechtsTxtBox {
	flex: 1 1 70%;
	float: right;
}
@media only screen and (max-width: 650px) {
    .rechtsTxtBox { 
		flex: 1 1 90%;		
		margin-left: 0%;
		margin-right: 1%;
		margin-top: 2%;
		margin-bottom:4%;
}
}

.txtGanzeBreite {
	width: 90%;
	margin-left:auto;
	margin-right:auto;
}

.kasten {
	border:2px solid gray; 
	padding:2%; 
	margin-top:3%;
}
.reihe {
	display: -webkit-flex;    
	display: -ms-flexbox;
	display: flex;
	margin-bottom: 2%;
	margin-left: auto;
	margin-right: auto;
	/*padding-left:5%;
	padding-right:5%;*/
	margin-top:1%;
	width:95%;
}

.flexZeile {
    display: flex;
    flex-direction: row;
}
@media only screen and (max-width: 400px) {	
    .flexzeile{
        flex-wrap: wrap;
    }
}

.flexSpalte {
    display: flex;
    flex-direction: column;
}

.buchvorstellung {
	display: -webkit-flex;    
	display: -ms-flexbox;
	display: flex;
	margin-bottom: 2%;
	margin-left: auto;
	margin-right: auto;
	/*padding-left:5%;
	padding-right:5%;*/
	margin-top:1%;
	width:95%;
}

.cover {
	-ms-flex: 1 1 38%;
    flex-basis: 38%;
    flex-grow: 1;
	width: 38%;
	margin-top:1%; 
	padding-left: 2%;
}

.bestellZeile {
	margin: 1% 2.5% 3% 2.5%;
	display: grid;
	grid-template-columns: 33% 33% 33%;  
	justify-content: space-between;
	align-items: baseline;
}

.bestellbutton {
	background-color: rgb(102, 151, 96);
	padding:2%; 
	text-align: center;
}
 
.bestellbutton a{
	color: white;
	text-align: center;
	text-decoration: none;
}

.navizeilenGrid {
	/*    width: 95%;*/
		margin: 1% 2.5% 3% 2.5%;
		display: grid;
		grid-template-columns: 10% 35% 10%;  
		justify-content: space-between;
	}
	
	#navizeile a {
		height: 2em; 
		text-decoration: none;
	}
	
	#navizeile svg:hover #schild{
	  fill: gray;
	  stroke: gray;
	}
	
	#navizeile svg:hover #haus{
		fill: gray;
		stroke: gray;
	  }
	
	#navizeile svg:hover text {
		fill: white;
	}
	

.logoBox {
	display: flex;
    flex-direction: column;
	-ms-flex: 1 1 20%;
    flex-basis: 20%;
    flex-grow: 1;
	width: 30;
	margin:2%; 
	padding-left: 2%;
}
.txt6 {
	font-family: "Roboto", sans-serif;
	color:#FFFFFF;
	font-size:2.4vw;
	font-weight:700;
	line-height:1.4;	
}
@media only screen and (min-width: 1000px) {	
  .txt6 {
     font-size: 24px;
  }
}
a:link {
	color: white;
	text-decoration: none;
}
a:hover { 
  color: black;
  background: white; 
}
.kontaktBox {
	-ms-flex: 1 1 29%;
    flex-basis: 29%;
    flex-grow: 1;
	width: 29%;
	padding-left:3%;
}
.bgBox {
	-ms-flex: 1 1 32%;
    flex-basis: 32%;
    flex-grow: 1;
	width: 32%;
}