body {
  background: black;
  font-family: Courier, Monospace;
  background-image: url("https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2F64.media.tumblr.com%2F96bfcda9ab211b730d680a052d19f83d%2Ftumblr_o7w2veChcr1runoqyo4_540.gifv&f=1&nofb=1&ipt=fce55679f5c821f04b10eb58e44e6af8aa3308a48b71786d92535c6cbde62d41");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  font-size: 1rem;
  overflow: hidden;
}

#wrap {
 display: flex;
  justify-content: center;
  flex-direction: row; 
  height: 95vh;
  width: 97vw;
  padding-top: 6%;
}

#frame {
 position: relative;
}

#innards {
  height: 60vh;
}

#myart {
  box-sizing: border-box;
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
  align-items: center;
  height: 60vh;
  border-radius: 5px;
  background-image: url(https://files.catbox.moe/ffwfxx.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  overflow-y: auto;
  padding-left: 2%;
  padding-right: 2%;
  font-family: Courier, monospace;
  color: #161626;
  gap: 10px;
}


#artintro {
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  font-size: 1rem;
}


#gallery {
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  width: 40vw;
  color: #E9E9F2;
  font-size: 1rem;
  gap: 45px;
}


.longimagebox{
  display: flex;
  overflow: hidden;
  box-sizing: border-box;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  max-width: 70vw;
  width: 500px;
  max-width: 80vw;
  padding: 4px;
}

.vertimagebox{
  display: flex;
  overflow: hidden;
  box-sizing: border-box;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 250px;
  max-width: 70vw;
  max-height: 800px;
  padding: 4px;
}

.bigimagebox{
  display: flex;
  overflow: hidden;
  box-sizing: border-box;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 500px;
  max-width: 70vw;
  height: 550px;
  padding: 4px;
}

.boxholder {
  display: flex;
  overflow: hidden;
  box-sizing: border-box;
  overflow-y: auto;
  max-width: 70vw;
  flex-direction: row;
  gap: 10px;
}

.holder {
  display: flex;
  overflow: hidden;
  box-sizing: border-box;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  max-width: 70vw;
  width: 500px;
}


.blur   {
    filter: blur(5px);
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    -o-filter: blur(5px);
    -ms-filter: blur(5px);
}

#homebutton {
  position: absolute;
  bottom: 5%;
} 


#overlay {
  width: 400px; /* Full width (cover the whole page) */
  height: 20%; /* Full height (cover the whole page) */
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  right: 0;
  bottom: 0;
  z-index: 15; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
}