/* ===========================
   ===== Lightbox  =====
   =========================== */

   #gallery{
	display: flex;
	flex-flow: row wrap;
	flex-wrap: wrap;
}
.gal_link{
	width: 33.33%;
	display: block;
	border:1px solid #fff;
	box-sizing: border-box;
	height: 250px;
	/* border-radius: 20px; */
	overflow: hidden;
}
.gal_link img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
.lightbox_img{
	max-width: none !important;
}
.lightbox_overlay{
	position: fixed;
	top: 0;
	left:0;
	background: black;
	opacity: .9;
	z-index:99999999999;
	cursor: pointer;
}

.lightbox{
	position: fixed;
	background: white;
	z-index: 999999999999999;
	top: 50%!important;
	transform: translatey(-50%) !important;
}

.spinner{
	position: fixed;
	top:calc(50% - 25px);
	left:calc(50% - 25px);
	font-size: 50px;
	-webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;

}

@-webkit-keyframes spin {
	from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(360deg);}
}

@keyframes spin {
	from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}


.close{
	position: fixed;
	color:#fff;
	font-size:30px;
	top: 20px !important;
	cursor: pointer;
	z-index:999999999999999999;
}

.next_img{
	position: fixed;
	color:#fff;
	font-size:50px;
	top: 50% !important;
	right:10px;
	cursor: pointer;
	z-index:99999999999999999999999;
	opacity:0.9;
}
.next_img:hover{
	opacity:1
}

.prev_img{
	position: fixed;
	color:#fff;
	font-size:50px;
	left:10px;
	cursor: pointer;
	z-index:99999999999999999999999;
	opacity:0.9;
	top: 50% !important;
}

.prev_img:hover{
	opacity:1;
}





@media screen and (max-width: 800px) {

	.gal_link {
		width: 50%;
		margin: 0 0;
	}
	}


	@media screen and (max-width:500px) {

		.gal_link {
			width: 100%;
			margin: 0 0 4px;
		}
		}