body {
  background-color: lightblue;
  /* justify-content: center; */
}

#menu {
  display: flex;
  flex-wrap:wrap;
  position:sticky;
  top: 0;
  opacity: .8;
  /* width: 35%; */
}

.menu-item {
  width: 19.2%;
  margin: 0 auto;
	background:linear-gradient(to bottom, #ffec64 5%, #ffab23 100%);
	background-color:#ffec64;
	border-radius:6px;
  border: 1px solid red;
	/* cursor:pointer; */
	color:#333333;
	font-family:'Press Start 2P', sans-serif;
	font-size: 110%;
	font-weight:bold;
	padding: .5%;
	text-decoration:none;
  text-shadow:0px 1px 0px #ffee66;
  text-align:center;
}
button {
  cursor: pointer;
}
.stats {
  width: 10%;
  margin: .5% auto;
	/* background:linear-gradient(to bottom, #ffec64 5%, #ffab23 100%); */
	background-color:#d6ca78;
	/* border-radius:6px; */
  border: 1px solid red;
	/* cursor:pointer; */
	color:#333333;
	font-family:'Press Start 2P', sans-serif;
	font-size: 70%;
	font-weight:bold;
	padding: 1%;
	text-decoration:none;
  text-shadow:0px 1px 0px #ffee66;
  text-align:center;
}

#possibleSets {
  text-align: center;
}

#foundSets {
  text-align: center;
}

#container {
  /* height: 150px; */
  /* padding: auto; */
  /* margin: auto; */
  display: flex;
  flex-wrap: wrap;
  /* transform: scale(2); */
  /* align-content: center; */
  /* align-items: stretch; */
  justify-content:space-evenly;
  /* display: inline-flex; */
  /* flex-wrap: wrap; */
  /* flex-direction: column; */
  /* width: 100%; */
  /* text-align: center; */

}

.img {
  cursor:pointer;
  /* width: 1.5rem; */
  /* transform: rotate(90deg); */
  display: inline-flex;
  /* height: 150px; */
  /* flex-grow: 2; */
  /* transform: scale(2) */
  /* align-items: center; */
  /* padding: 3px; */
  /* text-align: center; */

}

/* .img:hover{
  background-color: yellow;
} */

#sets {
  display: flex;
  /* flex-wrap: wrap; */
  /* width: 10%; */
  position: sticky;
  bottom: 0;
}

#foundSets {
  display: flex;
  /* flex-wrap:; */
  /* width: 10%; */
  position: sticky;
  bottom: 0;
  opacity: .8;
}

.set {
  padding: 0.5%;
  border: 2px solid greenyellow;
  width: 10%;
  display: inline-block;
  background:linear-gradient(to bottom, #ffec64 5%, #ffab23 100%);
}

.found-img {
  width: 33.33%;
}

/* @media only screen and (min-width: 100px) {
  .img {
    width: 27% !important; 
  }
}
@media only screen and (min-width: 200px) {
  .img {
    width: 27% !important; 
  }
}
@media only screen and (min-width: 375px) {
  .img {
    width: 30% !important; 
  }
}
@media only screen and (min-width: 600px) {
  .img {
    width: 25% !important; 
  }
}
@media only screen and (min-width: 850px) {
  .img {
    width: 24% !important; 
  }
}
@media only screen and (min-width: 875px) {
  .img {
    width: 23% !important; 
  }
}
@media only screen and (min-width: 1200px) {
  .img {
    width: 19.5% !important; 
  }
} */

