                body{   max-width: 100%;
			height: auto; 
                        margin: 5px;
   			font-family: Calibri;
  			background: #95391C;
   			display: grid;
                        grid-template-columns: repeat(1, 1fr);
                        grid-template-areas:     "head"
                                                 "nav "
                                                 "main"
						 "aside"
                                                 "foot";
                 }
		h1 {
   			text-align: center;
   			font-size: 30px;
		}


                header, nav, main, section, 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;
                }

         @media (min-width: 40em) {
                 body{
                        grid-template-columns: repeat(2, 1fr);
                        grid-template-areas:     "head head"
                                                 "nav  aside"
                                                 "main main"
                                                 "foot foot";
                 }
		h1 {
			text-align: center;
			font-size: 40px;
		}
         }

         @media (min-width: 60em) {
                 body{
                         grid-template-columns: repeat(4, 1fr);
                         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;
		}
         }