/* CSS Document */
         body{
                        margin: 10px auto;
                         max-width: 100%;
                         height: auto;
                        font-family: Calibri;
                        background: #FFF8DC;

                        display: grid;
                        grid-template-columns: repeat(1, 1fr);
                        grid-template-areas:     "head"
                                                 "nav "
                                                 "main"
												 "aside"
                                                 "foot";
                 }
		h1 {
			text-align: center;
			font-size: 25px;
		}


                header, nav, main, section, aside, footer {
                         border: 1px solid;
                         padding: 10px;
                         margin: 10px;

                }

                header {
                         background: #FFFFFF;
                         border-color: #d5d5d5;
                         grid-area: head;
                }

                nav {
                         background: #fffbf0;
                         border-color: #e7c157;
                         grid-area: nav;
                }

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

                aside {
                         background: #fffbf0;
                         border-color: #8db243;
                         grid-area: aside;
                }


                footer {
                         background: #fffbf0;
                         border-color: #8a9da8;
                         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;
		}
ul { list-sytle-type: disc;

table {
       border-style:solid;
       border-spacing: 20px;
       margin-left:  auto;
       margin: right;
      }
th,tr,td {  
            border-width: 4px;
           padding: 10px;
            }