body {
    background-color: rgb(0, 0, 0);
    display: grid;
    grid-template-columns:repeat(auto-fit, minmax(150px, 1fr));
    color: white;
    font-family: "dtm-sans";
    cursor: url("https://tweets009.neocities.org/images/cursor/1.png"), auto;
    grid-template-areas:
    'header headnav'
    'topnav topnav'
    'main main'
    'footer footer';
    margin-left: 5%;
    margin-right: 5%;
  }



a {
  color: rgb(255, 228, 193);
  text-decoration: none;
}
a:hover {
color: rgb(231, 131, 211);}
  


header {
  grid-area: header;
  background-color: rgb(25, 22, 30);
  font-size: 20px;
  max-height: fit-content;
}



headnav {
    grid-area: headnav;
    background-color: rgba(25, 22, 30);
}
  headnav ul {
    display: grid;
    list-style-type: none;
    grid-template-columns: repeat(2,  1fr);
    justify-items: center;
  }




topnav {
    grid-area: topnav;
    background-color: rgb(25, 22, 30);
}
topnav ul {
  display: grid;
  list-style-type: none;
  grid-template-columns: repeat(5,  1fr);
  justify-items: center;
}



main {
  grid-area: main;
  background-color: rgb(0, 0, 0);
  overflow-y: auto;
  overflow-wrap: break-word;
}
h3 {
   background-color: rgb(62, 56, 76); 
   text-align: center; 
}  



footer {
  grid-area: footer;
  background-color: rgb(15, 9, 30);
  color: white;
  text-align: center;
  border-style: solid none solid none;
  border-color: rgb(154, 74, 219);
}