.lightbox {
	background-color: white;
	z-index: 30;
	overflow: auto;
	padding: 0;
}
.lightbox #main{
	position: absolute;
	/*width: 100%;
	max-width: 1000px;*/
	min-width:50%;
	min-height:50%;
	left: 0;
	right: 0;
	margin: auto;
}

.lightbox #big_view{
	position: absolute;
	/*width: 100%;
	max-width: 1000px;*/
	min-width: 100%;
	min-height: 100%;
	left: 0;
	right: 0;
	margin: auto;
}

.lightbox #close, .lightbox #next, .lightbox #prev {
	position: fixed;
	cursor: pointer;
	transition: all .3s;
	padding: 10px;

	background-color: rgba(255,255,255, 0.5);
	color: #3E3E3E;
	border: 1px solid grey;
	border-radius: 10%;
}
.lightbox #close {
	top: 10px;
	right: 45px;
}
.lightbox #next {
	right: 50px;
	top: 45vh;
}
.lightbox #prev {
	left: 50px;
	top: 45vh;
}
.lightbox #prev::before {
	content: "\00276E";
}
.lightbox #close::before {
	content: "\00D7";
}
.lightbox #next::before {
	content: "\00276F";
}
.lightbox #prev:hover, .lightbox #next:hover, .lightbox #close:hover {
	background-color: rgba(255,255,255, .8);
	color: black;
	border-color: black;
}


/* ========== RESPONSIVE ========== */
/* Largest */
@media all and (max-width: 1280px) {
}

/* Large */
@media all and (max-width: 1024px){
}

/* Medium */
@media all and (max-width: 800px) {
	.lightbox #close, .lightbox #next {
		right: 10px;
	}
	.lightbox #prev {
		left: 10px;
	}
}

/* Small */
@media all and (max-width: 640px) {
	.lightbox #close, .lightbox #next {
		right: 5px;
	}
	.lightbox #prev {
		left: 5px;
	}
}
