p {
	font-family: "Exo 2","Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size: 13pt;
	color: #777;
	margin-top: 0em;
	margin-left: 0.5em; 
	padding: 0.5em;
}

h1 {
	font-family: "Exo 2","Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size: 18pt;
	color: #777;
	margin-left: 0.3em; 
	padding: 0.3em;
}

a {
	font-family: "Exo 2","Helvetica Neue",Helvetica,Arial,sans-serif;	
	color: black;
	text-decoration: none;	
}

.flex-container {
  display: flex;
  flex-direction: column;
  background: #eee; 
  padding: 0px;
  margin-top: 0px;
}

/* große Viewports */
@media all and (min-width: 800px) {
.flex-container {
    padding-left: 5em;
    flex-direction: row;
	flex-wrap: wrap;
    margin-left: auto;
    margin-right: auto;
    width: 80%;
  }
}

.flex-container-white {
  display: flex;
  flex-direction: column;
  background: white;
  padding: 0px;
  margin-top: 0px;
}

/* große Viewports */
@media all and (min-width: 800px) {
.flex-container-white {
    flex-direction: row;
	flex-wrap: wrap;
    margin-left: auto;
    margin-right: auto;
    width: 85%;
  }
}

.wrap {
  flex-wrap: wrap;
}


.flex-item {
    width: 90%;
	border: 0px solid;
	margin: 0px;
	padding: 0px;
}

/* große Viewports */
@media all and (min-width: 800px) {
.flex-item {
    width: 40%;
	border: 0px solid;
	margin: 0.5em;
	padding: 0.5em;
}

.flex-image-item {
    width: 40%;
	margin: 0em;
	padding: 0em;
}



.responsive {
  width: 100%;
  height: auto;
}