html {
  background-image: url(../images/rbowcolorsmusicnotes.gif);
  font-family: font-family;
  font-size: 18px;
  color: #f073ea;
}

h2 {
  color: #b650d8;
}

@font-face {
  font-family: font-family;
  src: url(../rainyhearts.ttf);
}

#contain-everything {
  background-image: linear-gradient(#ffadefd3, #fff3fd57);
  max-width: 90%;
  margin: auto;
  text-align: center;
  border-radius: 10px;
}

#holyyap {
  padding: 10px;
  max-width: 60%;
  margin: auto;
  color: #b650d8;
}

/* navigation */
.nav {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-image: linear-gradient(#ffadee, #f073ea);
  margin-inline: auto;
  text-align: center;
}

.navb {
  float: left;
}

.navb a {
  display: block;
  color: #fff3fd;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.textslop {
  background-color: #fff3fdc6;
  border-radius: 5px;
  margin-inline: auto;
  padding: 5px;
  text-align: center;
  margin: 10px;
}

.sort {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  margin: auto;
  padding: 5px;
  text-align: center;
}

.screenshot {
  margin: auto;
  margin: 5px;
  text-align: center;
}

.screenshot img {
  width: 350px;
  text-align: center;
}