body {
 margin-left: 0;
 margin-right: 0;
 margin-top: 0;
 background-color:#eee;
 padding:0;
 font-family:arial,helvetica,sans-serif;
}

body{
min-height:100vh;
display:grid;
grid: "head" 40px
      "nav" 30px
      "main" 1fr
      "navtree" 
      "aside"
      "foot";
align-items:stretch;
}


@media (min-width: 480px) { 
  body{
	grid: 
	"head head" 60px
        "nav nav" 30px
        "navtree main" 1fr
        "aside aside" min-content
        "foot foot" min-content
        / 1fr 2fr;
  }
  header >a {
   background-size:468px 60px;
   height:60px;
  }
}

@media (min-width: 960px) { 
  body{
    grid: "head head head" 60px
          "nav nav nav" 30px
          "navtree main aside" 1fr 
          "foot foot foot" min-content
          / 1fr  3fr 1fr;
 }
}

a{
  color:#c00;
}
a:visited{
  color:#900;
}
a:active{
  color:#930;
}

header {grid-area: head;}
nav {grid-area:nav;}
#navtree{grid-area:navtree;}
#content {grid-area:main; vertical-align:top;}
footer {grid-area:foot;}
#extras {grid-area:aside;}

body header >a{
	display:block;
	text-align:center;
	background-color:#ccc;
	background-image:url(/snip/images/pl1_banner.png);
	background-size:contain;
	background-position:center top;
	background-repeat:no-repeat;
	max-height:60px;
	min-height:40px;
}
nav{
	text-align:center;
	border-bottom:2px solid #666;
}

nav a {
	padding-left:0.5em;
	padding-right:0.5em;
}

#navtree{
	display:inline-block;
	max-width:200px;
	vertical-align:top;
}
footer {
	margin-top:2em;
	text-align:center;
	border-top:2px solid #666;
	padding-top: 0.5em;
}

footer a {
	padding:0.5em;
}
h1 {
        font-weight:bold;
        color: #600;
	text-align:center;
}

h2 {
	font-weight: bold;
	color: #660000;
	text-align:center;
}

h3 {
        color: #660000;
}

dd {margin-left:1em;}

pre {
	text-align:left;
	border-width:1px;
	border-color:#990000;
	border-style:solid;
	background-color:#fff;
}

table.nav {
        background-color:#FFF;
        border-width:1px;
        /* border-color:#FF6600; */
        border-color:#FF0000;
        text-align:center;
        font-weight:bold;
        font-size: 11pt;
        margin-bottom: 10px;
}

table.info {
	background-color:#ccc;
	border-width:1px;
	border-color:#cc0000;
	margin-left:auto;
	margin-right:auto;
	vertical-align:top;
}
table.info tr {
	background-color:#fff;
}
table.info th {
	background-color:#cc0000;
	color:#FFF;
	font-size: 12pt;
}

ul.nav{
	/*margin-left:5px;*/
	padding-left:5px;
	list-style:none;
	text-align:left;
}

.item {
	display: inline-grid;
	grid: "nw no" "mw mo" "south south";
	align-items: baseline;
	gap: 10px;
	justify-items: start;
	align-items: center;
	background-color: #fff;
	margin-top: 1em;
	padding: 0.5em;
	border: 1px solid #ccc;
	width:450px;
}
.item h3 {
	grid-area: nw;
}
.item .thumb {
	grid-area: mw;
}
.item .desc {
	vertical-align: top;
	grid-area: south;
}
.item .status {
	grid-area: no;
}

@media print {

}