div {
	color: white;
}

#overlay {
  position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  left:0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.5);
  z-index: 2;
  cursor: pointer;
}
#overlay_right {
	position: fixed;
	display: none;
	width: 20%;
	height: 80%;
	top: 0%;
	left: 80%;
	right: 100%;
	bottom: 20%%;
	align-items: center;
	/* background-color: rgba(126,0,126,0.25); */
	z-index: 3;
	cursor: pointer;
	text-align: right;
}
#overlay_left {
	position: fixed;
	display: none;
	width: 20%;
	height: 80%;
	top: 0%;
	left: 0%;
	right: 20%;
	bottom: 20%%;
	align-items: center;
	/* background-color: rgba(0,126,0,0.25); */
	z-index: 3;
	cursor: pointer;
	text-align: left;
}

#overlay_bl {
	position: fixed;
	display: none;
	width: 20%;
	height: 20%;
	top: 80%;
	left: 0%;
	right: 80%;
	bottom: 0%%;
	/* background-color: rgba(0,126,126,0.25); */
	z-index: 3;
	cursor: pointer;
}
#overlay_br {
	position: fixed;
	display: none;
	width: 20%;
	height: 20%;
	top: 80%;
	left: 80%;
	right: 100%;
	bottom: 0%%;
	margin-top: auto;
	justify-content: right;
	/* background-color: rgba(0,126,126,0.25); */
	z-index: 3;
	cursor: pointer;
}
.overlay_img {
	display: block;
  margin-top: auto;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: auto;
  max-height: 100%;
  max-width: 100%;
  z-index: 4;
}

.gallery-grid {
	display: grid;
	grid-template-columns: auto auto auto auto auto auto;
	grid-gap: 12px;
	padding: 12px;
	background-color: black;
}

.gallery-grid > div {
}

@media only screen and (max-width: 900px {
	.gallery-grid { grid-template-columns: auto auto auto; }
}

video {
	height: 100%;
	width: auto;

html {
	background-color: black;
	margin: 0px;
	height: 100%;
}

body {
	background-color: black;
	margin: 0px;
	padding: 0px;
	width: 100%;
	min-height: 100%;
}