* 	{		margin: 0; padding: 0;border: 0;scroll-behavior: smooth;
					-webkit-box-sizing: border-box;	-moz-box-sizing: border-box;box-sizing: border-box; 
					}
header, main, nav, section, footer, article, aside { display: block;}

.grid-rasta { 
  height:100vh; 
  display: grid; 
  grid-template-rows: 192px 2fr auto; 
  grid-template-columns: 10% 20% 30% 30% 10%; 
  grid-template-areas:  
    "header header header header header" 
    "content content content content content"  /* mit leerem Feld z.B.: content content content . sidebar.*/
    "footer footer footer footer footer";
  grid-gap: 4px 11px; /* der 1. Wert steht fuer grid-row-gap. der 2. fuer grid-column-gap...*/
  grid-gap: 0; } 

header { grid-area: header; 
	background: black;
	
	z-index:1;
 	grid-column:1 / 6; 
 	grid-row:1 / 2; 
				 /* meint eigentlich: grid-row:1 / 2; 			 
				  grid-column-start:1; 
				  grid-column-end:6; 
				  grid-row-start:1; 
				  grid-row-end:2; */
} 

article {  grid-area: content;
  z-index:0;} 
 
aside {  grid-area: sidebar;  } 

footer { grid-area: footer;
			padding:40px 10px;
			background:black;
			font-size:18px;
			line-height:1.2em;
			color:white;
			z-index:3;
			transform: skewY(3deg);}
.gegendreh	{transform: skewY(-3deg);}		
				






 .flexbox
  {	display: -webkit-flex;
	display: -moz-flex;
	display: flex;
	flex-direction: row;
	flex-wrap:wrap;
	-webkit-justify-content:flex-start;
	justify-content:flex-start;
	justify-content: space-between; 
	align-items: stretch;
	padding:0.5em 0;	
	width:100%;
	}
 article .flexbox
  {	background:white;width:100%;		}
	
.item { align-self:flex-start;
		margin-bottom:1em;}

.w30 {width:28%; }
.w33 {width:32%; }
.w35 {width:34%; }
.w40 {width:38%; }
.w45 {width:44%; }
.w50 {width:48%; }
.w60 {width:57%; }
.w70 {width:68%; }
.w100 {width:100%;}

.footerbreit {border-top:1px dashed silver;padding:0.5em;}

footer a {color:white;}
footer a:hover {color:lightblue;}
footer .footerbreit {	font-size:150%;text-align:center;}	
	
	
	
	
	

.show520, .show640, .show720, .show800, .show960, .show980 {display:none;}