/* The work below, CSSBox, is released under the Creative Commons
   Attribution-ShareAlike 4.0 license and is available on
   https://github.com/TheLastProject/CSSBox. You are not required to add
   additional credit to your website, just leave the above text in this file */

/* Modified by Aaron F. Ross */

div.cssbox {
	display: inline-block;
}

div.cssbox img {
	width: 100%;				/* image must have some width and height for object-fit to work */
	height: 18vw;
/*	padding: 2vw;*/
	object-fit: contain;
}

span.cssbox_full {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 99vw; 
	padding-right: 1vw;
	height: 100vh;  			/* Full viewport height */
	z-index: 999999;
	position: fixed;
	background-color: rgba(0,0,0,1.00);
	top: 0;
	left: 0;
	opacity: 0;
	pointer-events: none;
	cursor: default;
}

span.cssbox_full_child {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	width: 100vw;
}

span.cssbox_full img {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	max-height: 80vh;
	max-width: 80vw;
}

a.cssbox_close,
a.cssbox_prev,
a.cssbox_next {
  z-index: 999999;
  position: fixed;
  text-decoration: none;
  visibility: hidden;
  color: rgba(221,221,221,1.00);
  font-size: clamp(6vh, 8vw, 10vh);
}

a.cssbox_close {
  top: 2%;
  right: 2%
}

a.cssbox_close::after {
  content: '\00d7';
}

a.cssbox_prev,
a.cssbox_next {
  top: 50%;
  transform: translate(0%, -50%);
}

a.cssbox_prev {
  left: 1%;
}

a.cssbox_next {
  right: 1%;
}

a:target ~ a.cssbox_close,
a:target ~ a.cssbox_prev,
a:target ~ a.cssbox_next {
	visibility: visible;
	color: rgba(221,221,221,1.00);
}

a:target > img.cssbox_thumb + span.cssbox_full {
	visibility: visible;
	opacity: 1;
	pointer-events: initial;
	color: rgba(221,221,221,1.00);
}
/* This is the end of CSSBox */