body {
  background-color: black;
  color: white;
  cursor: url("https://slugger.neocities.org/graphics/cursors/cursor-small.png"), auto;
}

.container {
  display:grid;
  grid-template-rows: 1fr 2fr 1fr 1fr; 
  grid-template-columns: 1fr 2fr 1fr 1fr;
  grid-template-areas: "header header . nav" "about main main main";
  align-content:center;
  grid-gap: 15px;
}

.container div {
  border: 5px white solid;
}

.container div.navigation {
  grid-area: nav;
}

.container div.header {
  grid-area: header;
}

.container div.about-me {
  grid-area: about;
}

.container div.main-content {
  grid-area: main;
}

/* Fonts */

@font-face { 
  font-family: comic-sans;
  src: url(https://slugger.neocities.org/fonts/comic-sans.woff);
}

p1, ul, li {
  font-family: comic-sans;
}

@font-face { 
  font-family: heroin;
  src: url(https://slugger.neocities.org/fonts/Got_Heroin.woff);
}

h1 {
  font-family: heroin;
  font-size: 60px;
}