body { 
	font-family:Georgia,Utopia,Palatino,'Palatino Linotype',serif; font-size: 100%;
	display: grid;
	grid-template-areas: 
		"header header"
		"nav content"
		"nav footer";
	grid-template-rows: 60px 1fr 3em;  
	grid-template-columns: 15% 1fr;
	grid-row-gap: 0;
	grid-column-gap: 0;
	height: 100vh;
	margin: 0;
	}  
  
footer, main, div {padding: .5em 1em; }

nav {background-color: white; padding: 10px 0 0 10px; webkit-box-shadow: 0 3px 4px -1px rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.14), 0 5px 10px 0 rgba(0, 0, 0, 0.12);
    -moz-box-shadow: 0 3px 4px -1px rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.14), 0 5px 10px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 3px 4px -1px rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.14), 0 5px 10px 0 rgba(0, 0, 0, 0.12);}

/* Specific styles */
#pageHeader {grid-area: header; }
#pageFooter {grid-area: footer;}
#mainContent {grid-area: content;}
#mainNav {grid-area: nav; }
.plt {display:inline; float:right; width:10px; height:20px;  }
ul.nodot {list-style-type: none; margin: 0; padding: 0;}
.title {font-size:1.375em; line-height: 60px; margin: 0 1em;}
.dot {float: left; margin-right:10px}
.con {font-family: "Lucida Console",monospace; font-size:0.875em /* 14px/16=0.875em */ }

/* General styling */
h1 {font-size:2em; }
h2 {font-size:1.5em }
h3 {text-indent: 2em; font-size: 1.25em;}
h4 {text-indent: 3em; font-size: 1.1em;}
hr {width:65%; height:2px; border-width:0; clear: both}
dt {font-weight:bold;}
li, dd {padding: 3px 0;}
svg {display:inline-block;vertical-align:middle; height:50px}

/* General table styles */
table, th, td { border-collapse: collapse; padding: 4px}
th {font-style: normal; padding: 0px 8px}
table,th,td {border-bottom: 1px solid #330033; text-align:center}
caption {font-weight: bold; font-style: italic; padding-bottom: 4px; font-size: 1.15em; }

/*Specific table styles */
th.left,td.left,table.left td, {text-align:left}
td.pad {width: 100px}
.nob {border: 0; padding: 2px 10px; font-weight: normal;}	
table.bor th, table.bor td {border: 1px solid #181F25}

table.ex {margin-left:auto; margin-right:auto;border:0; }
table.ex td {border: 0; padding:0 15px}
table.ex tr {border: 0}
table.ex caption {caption-side:bottom; font-size: 1em;}


section {display:block; background-color:white; overflow: auto;
  -webkit-border-radius: 1em;-moz-border-radius: 1em;border-radius: 1em;
  padding: 1.25em;
  margin: 25px 15px;
	-webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
} 


/* Stack the layout on small devices/viewports. */
@media all and (max-width: 575px) {
	body { 
    grid-template-areas: 
      "header"
      "nav"
      "content"
      "footer";
    grid-template-rows: 80px 100px 1fr 70px;  
    grid-template-columns: 1fr;
 }
	svg {display:none}
	ul.nodot li {display: inline;}
}