:root {
  --windowcolor1: #6e917a
}

body {
  background-color: #B6D6C7;
  color: black;
  font-family: Verdana;
}

.backgroundcontainer {
  margin: auto;
  display: block;
  position: relative;
  bottom: 1px;
  width: 99%;
  height: 300px;
  z-index: -1;
}
.backgroundcontainer img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}


.headingbox {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 10px;
  border: solid 5px black;
  padding: 10px;
  margin: 10px
  
}

logocontain {
  display: flex;
  position: relative;
  width: 75px;
  height: 75px;
  border: 5px solid black;
  object-fit: cover;
}

titlebox {
  display: inline-block;
  position: relative;
  width: 50%;
  height: 75px;
  border: 5px solid black;
  gap: 10px;
  
}

.maingrid {
  display: grid;
  grid-gap: 10px;
  padding: 25px;
  margin: 25px;
  grid-template:
    "header header"
    "sidebar main"
    "sidebar footer"
    / 1fr 3fr;
}


header { 
  grid-area: header;
  background: var(--windowcolor1);
  padding: 10px; }
aside { 
  grid-area: sidebar; 
  background: var(--windowcolor1);
  padding: 10px;}
main { 
  grid-area: main; 
  background: white;
  padding: 10px;}
footer { 
  grid-area: footer; 
  background: white;
  padding: 10px;}