p.datum {
	text-align:left;
	font-size:80%;
}
body{
			margin: 1em ;
/*			max-width: 60em;*/
			font-family: sans-serif;
			color: #333333;

  display: grid;
  gap: 0.5em;
  grid-template-columns: repeat(2, 1fr);
  grid-template-areas: "head head "
                       "nav  nav"
                       "main main"
                       "aside aside" 
			"foot foot";
}

@media (min-width: 30em) { 
  body{
    grid-template-columns: repeat(3, 1fr);
    grid-template-areas: "head head head "
                         "nav  aside aside"
                         "main main main" 
		  	 "foot foot foot";
 }
}

@media (min-width: 50em) { 
  body{
	min-height: 95vh;
    grid-template-columns: 1fr 2fr 2fr 1fr;
	grid-template-rows: 6em 1fr 1fr 5em;
    grid-template-areas: "head head head head"
                         "nav  main main aside"
                         "nav  main main aside" 
 			     "foot foot foot foot";
 }
}

header, nav, main, article, section, aside, footer {
	border-radius: 0.5em;
	border: 1px solid;
	padding: 10px;
	margin: 1px;
}

header {
	background: #F1F3F4;
	border-color: #d5d5d5;
	background: #e4ebf2;
	border-color: #8a9da8;
	grid-area: head;	
}

nav {
	background: #fffbf0;
	border-color: #e7c157;
	min-width: 11em;
 	grid-area: nav;			
}

article {
	background: #e8e8e8;
	border-color: #7a7a7a;
  grid-area: main;				
}

aside {
	background: #ebf5d7;
	border-color: #8db243;
  grid-area: aside;
}
		
/*
#news {
 grid-area: news;			
}*/

footer {
	background: #e4ebf2;
	border-color: #8a9da8;
  grid-area: foot;				
}