body {
  text-align: center;
}

main {
        background-color: #f7f7f7;
        border-radius: 1.5em;
        margin-top: 2em; 
}

nav {
	display: flex;
	flex-flow: row wrap;
        background-color: #eee;
        border-radius: 1.5em; 
}

nav > p {
  text-align: center;
  width: 5em;
}

@media (max-width: 50em) { 
  .profilbild {
    width: 100%;
  }
}

.flex-container {
	display: flex;
	flex-flow: row wrap;
}

.flex-container > p {
  text-align: center;
  margin: 10px
}


.grid-container {
	display: grid;
	grid-template-columns: 1fr;
}

.grid-container > article {
      margin-top: 1em; 
}

.day-container {
	display: grid;
        grid-template-columns: auto auto auto auto; 
	
}

.day-container > p {

margin-right: 1em;

}


@media (max-width: 50em) { 
  .kartenbild {
    max-width: 100%;
  }
}

@media (min-width: 60em) { 
  .grid-container {
	display: grid;
	grid-template-columns: min-content 1fr;
  }

  .grid-container > article {
      margin-top: 1em; 
      grid-column: 1;
  }

  .grid-container > section {
      grid-column: 2;
      max-width: 50em
  }

}