body {
   
    display: grid;
    grid-template-columns: 80vw 20vw;
    grid-template-rows: 15vh 1fr 15vh;
    grid-template-areas:
        "headline headline"
        "main side"
        "footer side";
}



header {
    grid-area: headline;
  
}

aside {
    grid-area: side;
  
}

footer {
    grid-area: footer;
   
}

main {
    grid-area: main;
    min-height: 70vh;
}

@media only screen and (max-width: 768px) {
   
body {
   
    display: grid;
    grid-template-columns: 100vw;
    grid-template-rows: auto auto auto auto;
    grid-template-areas:
        "headline"
        "side"
        "main "
        "footer";
}
	
header {
    grid-area: headline;
  width: 100vw;
}

aside {
    grid-area: side;
  width: 100vw;
}

footer {
    grid-area: footer;
   width: 100vw;
}

main {
    grid-area: main;
    min-height: 70vh;
	width: 100vw;
}
  }