body {
  background-image: url('img/darkness.png');
}

.container {  display: grid;
  grid-template-columns: 0.6fr 1.8fr;
  grid-template-rows: 0.2fr 1.8fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    "HEADER HEADER"
    "LINKS MAIN";
}

/* lightbox */
body.no-scroll {
  overflow:hidden
}
body.no-extras .stickers, body.no-extras .blinkies, body.no-extras a {
  z-index:-1
}
    #lightbox {
			position:fixed; /* keeps the lightbox window in the current viewport */
			top:0;
			left:0;
			width:100vw;
			height:100vh;
			background:rgba(0, 0, 0, .7);
			text-align:center;
		}
		#lightbox p {
			text-align:right;
			color:#fff;
			margin-right:50px;
			font-size:30px;
		}
		#lightbox img {
			/* box-shadow:0 0 25px #111; */
			max-width:80vw;
      max-height:80vh;
      width:100%;
      height:100%;
      object-fit:contain;
		}
/* lightbox end */

.HEADER { grid-area: HEADER; }

.LINKS { grid-area: LINKS; }

.MAIN { grid-area: MAIN; }

h1 {
  background: black;
  color: green;
  text-align: center;
}

h2 {
  background: black;
  color: green;
}

h3 {
  background: black;
  color: green;
}

article {
	background: black;
	color: white;
}

nav {
	background: black;
	color: white;
}

a {
	color: white;
}

figcaption {
	background: black;
	color: white;
}

img {
  max-width: 100%;
}

a:hover {
	background-color: black;
	text-color: white;
	font-size: 30px;
}
