/* page layout */
   #page {
      display: grid;
      width: 100%;
      grid-template-areas:
         "header header"
         "nav  main"
         "footer  footer";
      grid-template-rows: auto 1fr auto;
      grid-template-columns: 170px 1fr;
      grid-gap: 0px;
   }
   @media (max-width: 600px) {
      #page {
         grid-template-areas:
            "header"
            "nav"
            "main"
            "footer";
         grid-template-rows: auto 1fr auto auto;
         grid-template-columns: 1fr;
      }
   }
   #page > header {
      grid-area: header;
      background-color: #fff;
      border: 0px solid #000;
   }
   #page > header > a > img {
      width: 100%;
      height: auto;
   }
   #page > nav {
      grid-area: nav;
      background-color: #fff;
      border-right: 1px solid #066;
      padding: 0 1rem 0 1rem;
   }
   #page > nav > .menu ul {
      list-style-type: none;
      margin: 0;
      padding: 0;
   }
   #page > nav > .menu li {
      text-align: center;
      padding: 8px;
      margin-bottom: 7px;
      background-color: #a6c9c9;
      color: #fff;
      box-shadow: 5px 5px 10px #aaa;
   }
   #page > nav > .menu a {
      text-decoration: none;
   }
   #page > nav > .menu a:hover {
      text-decoration: none;
      color: #fff;
   }
   #page > nav > .menu li:hover {
      background-color: #008080;
   }
   #page > main {
      grid-area: main;
      background-color: #fff;
      border: 0px solid #000;
      padding: 0 1rem 0 1rem;
   }
   #page > main a {
      text-decoration: none;
   }
   #page > main a:hover {
      text-decoration: underline;
   }
   #page > main > table {
   width:       50%;
   margin-left: 25%;
   margin-right: 25%;
}
#page > main > table.office_hours {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   margin: 2px auto;
   white-space: nowrap;
   border-collapse: collapse;
}
#page > main > table.office_hours th, .office_hours td {
   border: 1px solid #006666;
   text-align: center;
   padding: 0.25em 10px;
   color: #066;
}
#page > main > table.office_hours th {
   background-color: #a6c9c9;
   color: #600;
}
#page > main > table.office_hours caption {
   color:#600;
}
#page > footer {
   grid-area: footer;
   background-color: #d9e8e8;
   border: 0px solid #000;
}