body { 
    margin: 0;
    width: 100%; 
    background-image: url("https://themadcrystal.neocities.org/wiki/squidward.jpeg");
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
}

.topstuff {
  background-image: linear-gradient(180deg, rgba(69, 69, 69, 1) 0%, rgba(40, 40, 40, 1) 5%, rgba(21, 21, 21, 1) 95%, rgba(0, 0, 0, 1) 100%);
  overflow: hidden;
  margin: auto;
}

.topstuff a {
  float: left;
  color: #f2f2f2;
  text-align: center;
  padding: 8px 16px;
  text-decoration: none;
  font-size: 17px;
  font-family: arial, sans-serif;
  display: block;
}

/* comment */
.topstuff a:hover {
  background-image: linear-gradient(180deg, rgba(105, 105, 105, 1) 0%, rgba(82, 82, 82, 1) 5%, rgba(40, 40, 40, 1) 95%, rgba(20, 20, 20, 1) 100%);
  color: white;
}

.active {
  background-image: linear-gradient(180deg, rgba(212, 41, 255, 1) 0%, rgba(134, 4, 170, 1) 5%, rgba(90, 0, 115, 1) 95%, rgba(58, 0, 74, 1) 100%);
  color: white;
}

img {
  display: block;
}

.mainshit {
  background-color: rgba(255, 255, 255, 1);
  margin: auto;
  display: flex;
  flex-direction: column;
  font-family: "Arial", cursive;
}

.mainshit p {
  padding-left: 10px;
  padding-right: 10px;
}

.mainshit h1 {
  text-decoration: underline;
  padding-left: 5px;
  padding-right: 5px;
}

.mainshit h2 {
  text-decoration: underline;
  padding-left: 5px;
  padding-right: 5px;
}

.mainshit h3 {
  text-decoration: underline;
  padding-left: 5px;
  padding-right: 5px;
}

.yawn {
  background-color: rgba(200, 200, 200, 1);
  margin: auto;
  display: flex;
  flex-direction: column;
  font-family: "Arial", cursive;
}

.yawn p {
  padding-left: 10px;
  padding-right: 10px;
}

.link {
  
}

.link a {
  float: left;
  padding: 5px
}