body {
  background-image: url("website-background.png");
  background-size: cover;
  background-position: center;
  height: 100vh;
  margin: 0;
  color: blue;
  font-family: 'aseprite', Courier;
  font-size: 200%;
  margin: 50px;
}

home {
  display: inline-block;
  margin-bottom: 30px;

a:link {
  color: white;
}

a:visited {
  color: white;
}

a:hover {
  text-decoration: none;
}

}

/*my whole container*/ 
.container {
  display: grid;
  grid-gap: 100px;
  grid-template:
    "journal links"
    "log links"
    / 50%;
}


/*settings for all the headers*/
.container header {
  font-size: 150%;
  height: 50px;
  width: 400px;
  background-color: lightyellow;
  border: 3px dashed blue;
  box-sizing: border-box;
  opacity: 0.8;
  padding: 5px;
}


/*journal*/ 
.journal-box {
  grid-area: journal;


.journal {
  max-height: 500px;
  overflow-y: auto;
  padding: 5px;
  border: 3px dashed blue;
  background-color: lightyellow;
  opacity: 0.8;
}
}

/*change log*/
.change-log-box {
  grid-area: log;


.change-log {
  max-height: 200px;
  overflow-y: auto;
  width: 500px;
  padding: 5px;
  border: 3px dashed blue;
  background-color: lightyellow;
  opacity: 0.8;
}
}

/*links*/
.links-box {
  grid-area: links;


.links {
  width: 500px;
  padding: 5px;
  border: 3px dashed blue;
  background-color: lightyellow;
  opacity: 0.8;
}
}