body {
  min-height: 100vh;
  background: url("Backgrounds/bg-4.gif");
  color: #727070;
  letter-spacing: 1px;
  overflow-x: hidden;
  max-width: 100%;
}


.title {
  -webkit-text-stroke: 10px #ffffff;
  paint-order: stroke fill;
  color: black;
  font-family: "Conthrax", Arial, Helvetica, sans-serif;
  font-size: 70px;
  margin-left: 20px;
}

.bannerad {
  max-width: 350px;
  width: 100%;
}

.tab {
  display:none;
  width: 100%;
}

.tab.active {
  display: block;
}

.grid-container {
  justify-items: center;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  gap: 5px;
  margin-bottom: 10px;
}
.game-frame {
  position: relative;
  display: flex;

  justify-content: center; /* horizontal */
  align-items: center;     /* vertical */

  width: 100px;
  height: 155px; /* important for vertical centering */
}
.game-frame:hover {
  transform: scale(1.05);
  
}

.game-photo {
  display: block;
  width: 99px; /* adjust */
  height: 143px;
  align-self: flex-end;
}

.game-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none; /* lets clicks go through */
}

.nostalgiacorner {
  position: relative;
  width: 200px;
  height: 300px;
}

.gameboy {
  position: absolute;
  top: 0;
  left: 0;
  width: 200px;
  height: 300px;
  pointer-events: none;
  z-index: 2;
}

.nostalgia-image {
  width: 100%;
  height: 100%;

  object-fit: cover;

  display: block;
  
}
.nostalgia-frame {
  position: absolute;
  /* tweak these to fit the Game Boy screen */
  top: 15%;
  left: 25%;
  width: 100px;
  height: 88px;
  background-color: white;
  z-index: 1;
  
}




.menu-bar {
	border-radius: 10px;
	height: fit-content;
	display: flex;
	background-color: rgb(61, 133, 255);
    backdrop-filter: blur(2px);  
	align-items: center;
	padding: 0 10px;
	li {
		list-style: none;
		color: white;
		font-family: sans-serif;
		font-weight: bold;
        font-size: 14px;
		padding: 12px 16px;
		margin: 0 8px;
		position: relative;
		cursor: pointer;
		white-space: nowrap;
	}
}
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
