body {
  color: #ffffff;
  background-image: url(https://cberrysundae.neocities.org/psychopomp%20bg.png);
  background-size: cover;
  background-color: black;
  background-position: center;
    max-width: 800px;
    max-height: 1000px;
    justify-content: center;
    align-items: center;
    display: grid;
    grid-gap: 1px;
    grid-template-columns: 150px minmax(0, 1fr);
  position: relative;
  overflow-y: auto;
  overflow-x: auto;
  background-repeat: no-repeat;
}


* {
box-sizing: border-box;
}

a:link {
    color:#ffffff
}

a:visited {
    color: #0400ff;
}

/*the actual layout bruv*/
header, icon, nav, main, nav2, banner, footer, gallery {
    border: #000094 3px solid;
    background-color: rgb(0, 0, 0);
    font-family: 'MS PGothic', sans-serif;
}

header {
  grid-row: 1 / 2;
  grid-column: 2 / 6;
  overflow-y: hidden;
  height: 500px;
  width: 657px;
  border-top-right-radius: 50px;


}

banner {
  grid-row: 3 / 4;
  grid-column: 1 / 6;
  width: 809px;
}

nav {
  grid-row: 1 / 9;
  grid-column: 1 / 2;
  height: 500px;
  ul {
    list-style: none;
    padding: .5em;
  }
  li {
    margin: 0px;
    scrollbar-color: #1900ff;
  }
  
/*random statuscafe cameo*/
  #statuscafe {
    padding: .5em;
    background-color: rgb(0, 0, 0);
    border-top: 3px solid rgb(0, 0, 165);
    border-bottom: 3px solid rgb(0, 0, 165);
}
#statuscafe-username {
    margin-bottom: .5em;
}
#statuscafe-content {
    margin: 0 1em 0.5em 1em;
}
}


/*ok back to business*/
main {
  grid-row: 3 / 4;
  grid-column: 1 / 6;
  width: 809px;
  
}

footer {
  grid-row: 4 / 6;
  grid-column: 1 / 6;
  width: 809px;
  overflow: hidden;
  border-bottom-right-radius: 50px;
  height: 150px;
  background-image: url(https://cberrysundae.neocities.org/c7e476d2-5d9d-46e7-85e6-367e59f88432.png);
}

/*I HATE MAKING FUCKASS SCROLLBARS*/
* {
    scrollbar-color: #08005d #000000;
}

/*le gallery*/


.gallery div {
  width: 100px;
  height: 100px;
  margin: 5px;
  border: 1px double;
}

.gallery div img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gallery {
  display: flex;
  flex-wrap: wrap;
}

/*le gallery part duex*/
.gallery2 div {
  width: 100px;
  height: 100px;
  margin: 5px;
  border: 1px double;
}

.gallery2 div img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gallery2 {
  display: flex;
  flex-wrap: wrap;
}

@media (max-width: 600px) {
 height: auto;
}