html, body {
      margin: 0;
      padding: 0;
      width: 100vw;
      height: 100vh;
      overflow: hidden;
}

body {
  background-color: #B4D3A1;
  background-repeat: no-repeat;
  color: black;
  font-family: "pica";
}

.noise {
position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 2;
background: rgba(180, 211, 161, 1);
background-image: url("https://mwokam.com/main.svg");
mix-blend-mode: overlay;
opacity: 0.7;
}

h1 {
position: fixed;
  color: black;
 text-align: center;
  font-family: "pica";
font-size: 600%;
display: block;
margin-top: 300px;
margin-left: 450px;
  }

#pancakes1 {
position: fixed;
margin-top: 50px;
margin-left: 150px;
}

#pancakes1 img {
width: 100px;
}

#pancakes1 p {
width: 100px;
position: absolute;
text-align: center;
margin-top: 2px;
}

#pancakes2 {
position: fixed;
margin-top: 20px;
margin-left: 1250px;
}

#pancakes2 img {
width: 100px;
}

#pancakes2 p {
width: 100px;
position: absolute;
text-align: center;
margin-top: 2px;
}


#cake2 {
position: fixed;
margin-top: 500px;
margin-left: 650px;
}

#cake2 img {
width: 100px;
}

#cake2 p {
width: 100px;
position: absolute;
text-align: center;
margin-top: 2px;
}


#matcha1 {
position: fixed;
margin-top: 600px;
margin-left: 80px;
}

#matcha1 img {
width: 100px;
}

#matcha1 p {
width: 100px;
position: absolute;
text-align: center;
margin-top: 2px;
}

#chicken1 {
position: fixed;
margin-top: 75px;
margin-left: 450px;
}

#chicken1 img {
width: 100px;
}

#chicken1 p {
width: 100px;
position: absolute;
text-align: center;
margin-top: 2px;
}

#brownie1 {
position: fixed;
margin-top: 650px;
margin-left: 850px;
}

#brownie1 img {
width: 100px;
}

#brownie1 p {
width: 100px;
position: absolute;
text-align: center;
margin-top: 2px;
}

#cookies1 {
position: fixed;
margin-top: 50px;
margin-left: 920px;
}

#cookies1 img {
width: 100px;
}

#cookies1 p {
width: 100px;
position: absolute;
text-align: center;
margin-top: 2px;
}

#cookies2 {
position: fixed;
margin-top: 500px;
margin-left: 1150px;
}

#cookies2 img {
width: 100px;
}

#cookies2 p {
width: 100px;
position: absolute;
text-align: center;
margin-top: 2px;
}

#cake1 {
position: fixed;
margin-top: 300px;
margin-left: 100px;
}

#cake1 img {
width: 100px;
}

#cake1 p {
width: 100px;
position: absolute;
text-align: center;
margin-top: 2px;
}


.dialog {
width: 300px;
position: relative;
top: 60px;
left: 500px;
  background: white;
  border: 4px solid lightblue;
  padding: 10px;
z-index: 50;
 
}

.dialog img{
width: 300px;
}

.hidden {
  display: none;
}
.clickable {
  cursor: pointer;
  margin: 10px;
  padding: 10px;
}