.gallery {
	width:33%;
}

.gallery-container{
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.gallery-title-container{
	flex-basis: 100%;
	margin-bottom: 20px;
}

.gallery .media{
	height: 300px;
	overflow: hidden;
	cursor: pointer;
}

.gallery .media img {
	max-width: unset;
	min-height: 100%;
	margin-left: 50%;
	transform: translateX(-50%);
}

@media (max-width: 1024px) {
	.gallery .media{
		height: 500px;
		overflow: hidden;
		border-radius: 10px;
		cursor: pointer;
	}

	.gallery .media img {
		max-width: unset;
		min-height: unset;
		margin-left: 50%;
		transform: translateX(-50%);
	}
	
	.gallery .caption {
		font-size: 18px;
		margin: 5px 0px 25px 0px;
	}
}

.gallery .media video{
	/*width: 400px;*/
}

.gallery .caption {
	cursor: pointer;
	font-size: 18px;
}

h3.galleryTitle {
	font-size: 22px;
	font-weight:400px;
	margin-bottom: 20px;
}

span.galleryDescription {
	font-size: 20px;
}

/* overlay */

.LBoverlay {
	width: 100vw; height: 100vh;
	top: 0px; left: 0px;
	position: fixed; 
	background: #09090c; 
	opacity: 0; 
	transition: all 0.5s; 
	z-index: -100;
}
.LBoverlay.on { opacity: 1;  z-index:1000;}
.lightbox { 
    display: none; 
    transition: all 1s; 
    border-radius : 5px;
    background-color: #222222;
    color: #09090c;  
	/*border: solid 1px white;*/
    font-family: sans-serif;
    text-align: center;
}
.lightbox.on { display:block; }

#LBGallery {
	position: absolute;
    left: 0px;
    top: 0px;
	width: calc(100vw - 60px);
    height: calc(100vh - 60px);
    z-index: 1000;
    margin: 40px;
    background: transparent;
    backdrop-filter: blur(3px);
    cursor:pointer;
}


/* The Close Button */
.btnClose {
  color: white;
  border: 2px solid white;
  position: absolute;
  background-color: #222222;
  z-index:1000;
  top: 5px;
  right: 35px;
  font-weight: bold;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  cursor:pointer;
}

@media(max-width: 990px){
    .btnClose{
        top: 5px;
        right: 5px;
    }
}

.btnClose:hover,
.btnClose:focus {
  color: #999;
  text-decoration: none;
  cursor: pointer;
}

.btnClose::before {
  content: " ";
  position: absolute;
  display: block;
  background-color: white;
  width: 2px;
  left: 12px;
  top: 5px;
  bottom: 5px;
  transform: rotate(45deg);
}
.btnClose::after {
  content: " ";
  position: absolute;
  display: block;
  background-color: white;
  height: 2px;
  top:12px;
  left: 5px;
  right: 5px;
  transform: rotate(45deg);
}

.lightbox-title {
		color: white;
		font-weight: bold;
}

.lightbox-description {
	color: white;
}

.lightbox-media {
	max-height: 80vh;
	max-width: 90vw;
	border-radius: 10px;
}