body   
{
   margin: 5px;
   font-family: Calibri;
   background: #95391C;
   display: grid;
   grid-template-columns:  lfr;
   grid-template-areas:    "head"
                           "nav"
                           "main"
                           "aside"
                           "foot";
}
   @media (min-width:40em) 
   {
   body {
   margin: 5px;
   font-family: Calibri;
   background: #95391C;
   display: grid;
   grid-template-columns: repeat(2, lfr);
   grid-template-areas:    "head head"
                           "nav aside"
                           "main main"
                           "foot foot";
         }
    }
   @media (min-width: 60em) 
   { 
   body {
   margin: 5px;
   font-family: Calibri;
   background: #95391C;
   display: grid;
   grid-template-columns: repeat(4, lfr);
   grid-template-areas:    "head  head head head"
                           "nav   main main main"
                           "aside main main main"
                           "foot  foot foot foot";
        }
    }
h1 {
   text-align: center;
   font-size: 50px;
}


header, nav, main, article, aside, footer {
   border: 5px solid;
   padding: 10px;
   margin: 2px;
}

header {
   background-color: #D3D3D3;
   border-color: #B0B0B0;
   grid-area: head;
}

nav {
   background-color: #FFFBF0;
   border-color: #E7C157;
   grid-area: nav;
}

main {
   background-color: #FFFFFF;
   border-color: #DF6C20;
   grid-area: main;
}

aside {
   background-color: #FFFBF0;
   border-color: #8DB243;
   grid-area: aside;
}

footer {
   background-color: #D3D3D3;
   border-color: #B0B0B0;
   grid-area: foot;
}