body {
	background-color:black;
	font-family: Helvetica,Arial,sans-serif;
  //margin: 40px;
}

h1 { margin:5px 0px; }
h2 { margin:5px 0px; }
h1+h2 { margin:-5px 0px 5px 0px; }
h3 { margin:5px 0px; }
main {width:100%;}


.sidebar {
	grid-area: sidebar;
}
    .sidebar ul {  list-style-type: none;
      margin: 0px;
      padding: 0px;
    }
    .sidebar li   {
      border-style:solid;
      border-color:rgba(255,255,255,0);
      border-width:1px;
      border-left: none;
      border-right: none;
      padding:5px 0px;
      transition: background 1s, border 1s;
    }
    .sidebar li.hover {
      border-color:black;
      background-color:#e9e2cf; 
    }
    .sidebar ul>li>ul>li {padding: 5px;}
X.sidebar li,sidebar li ul { list-style-type:none; margin:0.5em 0px; }
X.sidebar li {
	border-style:solid;
	border-color:rgba(255,255,255,0);
	border-width:1px;
  border: none none none solid
	margin: 0px 0px 0px -2em;
	padding:8px 0px;
	transition: background 0.5s, border 1s, padding 1s, margin 1s;
}
X.sidebar li.hover { 
	border-top: solid 1px #630; 
	border-bottom: solid 1px #630; 
	margin-top:2px;
	margin-bottom:2px;
	background-color:#ede1aa; /* lightTan */ /* #e9e2cf; */
	padding:6px 0px;
	list-style-type:circle;
}
.sidebar ul { margin:0px; }
.sidebar a {text-decoration:none;}
.sidebar a:link, .sidebar a:visited, .sidebar a:hover {color:#000;}
.content {
    grid-area: content;
}
.header {
    grid-area: header;
    min-height:75px;
}
.header a:link, .header a:visited { color:#fc6; }
.header a:hover { color: #fdb; }
.footer {
    grid-area: footer;
}
.logo {
	grid-area: logo;
  overflow: hidden;
  height:75px;
}

.box {
    background-color: #fff;
    color: #000;
    border-radius: 5px;
    padding: 10px;
    //font-size: 150%;
}

.wrapper {
    background-color: #000;
    color: #444;
}
.blank .wrapper {
	display: block;
	width: 100%;
}
.layout1 .wrapper {
	display: grid;
    grid-gap: 10px;
    grid-template-columns: auto;
    grid-template-areas:
      "header"
      "sidebar"
      "content"
      "logo"
      "footer";
}
.layout1 .hidden1col { display:none; }

.layout2 .wrapper {
   display: grid;
    grid-gap: 10px;
    grid-template-columns: 220px auto 220px ;
    grid-template-areas:
        "header    header  logo"
        "sidebar content content"
        "footer  footer  footer";
 	
}
.layout1 .menuToggle { display:inline !important; }

/* These background colors must be defined after the wrapper */
.header,.footer { background-color: #630; /*#442416;*/ /* brown */ color:#fff; }
.logo { background-color:#816f5f; /* darkGray */ color:#fff;}
.sidebar { background-color:#c0aa71; /* #bdb1a7; */ /* warmGray */ }


/* Variable media width */
@media(max-width:1023px) {
  .menuToggle {display:inline !important;}
  .layout2 .wrapper {
    grid-template-columns: auto;
    grid-template-areas:
      "header"
      "sidebar"
      "content"
	  "logo"
	  "footer";
  }
  .layout2 .hidden1col { display:none; }
  .header { min-height: auto !important; }
}
@media(max-width:670px) {
  #topSearch { clear:both; float:left; display:none; }
  .layout2 .hiddenSearch, .hideWhenNarrow { display:none; }
}
@media(max-width:866px) {
  .col-25 { width: 33% !important }
  .col-75 { width: 100% !important }
}
@media(max-width:750px) {
  .col-25 { width: 49% !important; }
  .col-33 { width: 49% !important; }
}
@media(max-width:550px) {
  .col-25 { width: 100% !important; }
  .col-33 { width: 100% !important; }
  .col-50 { width: 100% !important; }
  .layout2 .hiddenHead, .hideWhenNarrow{ display:none; }
  #w { width:25px !important; }
}