.vignettes_container {
	position: relative;
	padding: 0 100px 50px 100px;
}

.vignettes_container .slick-list, .lightbox_box_slider .slick-list {
	overflow: hidden;
}

.vignettes_container .slick-track, .lightbox_box_slider .slick-track {
	display: flex;
	margin: auto;
}

.vignettes_container .vignette_item {
	padding: 0 15px;
	cursor: pointer;
}

.vignettes_container .vignette_ratio {
	position: relative;
	padding-bottom: 100%;
	border: 1px solid var(--oxy_color_8);
}

.vignettes_container .vignette_item img {
	width: 100%;
	height: 100%; 
	object-fit: cover;
	position: absolute;
	top: 0;
	left: 0;
}

.vignettes_container .slick-prev {
	top: 110% !important;
	bottom: unset !important;
	left: 45% !important;
	/*border: 1px solid var(--oxy_color_8);*/
	/* background-image: url(/wp-content/uploads/2022/09/more-arrow-white-copie.svg) !important; */
	background-image: url(/wp-content/uploads/2025/04/more-arrow-green_neon.svg) !important;
	background-color: var(--oxy_color_6) !important;
	/* opacity: 0.2; */
	transition: 0.3s;
}

.vignettes_container .slick-next {
	top: 110% !important;
	bottom: unset !important;
	right: 45% !important;
	/*border: 1px solid var(--oxy_color_8);*/
	/* background-image: url(/wp-content/uploads/2022/09/more-arrow-white-copie.svg) !important; */
	background-image: url(/wp-content/uploads/2025/04/more-arrow-green_neon.svg) !important;
	background-color: var(--oxy_color_6) !important;
	/* opacity: 0.2; */
	transition: 0.3s;
}
.vignettes_container .slick-next:hover, .vignettes_container .slick-prev:hover {
	/* opacity: 1; */
	opacity: .7;
} 

.lightbox {
	position: fixed;
	background-color: rgba(0,0,0,0.7);
	width: 100vw;
	height: 100vh;
	top: 0;
	z-index: 10000000000;
	left: 0;
	display: none;
}

.lightbox img {
	width: 600px;
	height: 600px;
	object-fit: contain;
}

.lightbox_box_close {
	position: absolute;
	top: 20px;
	right: 30px;
	cursor: pointer;
	z-index: 100000000000;
	transform: rotate(45deg);
}

.lightbox_box_slider .slick-track, .lightbox_box_slider, .lightbox_box_slider .slick-list {
	height: 100%;
}

.lightbox_box_slider .slick-slide {
	display: flex;
	align-items: center;
	justify-content: center;
}

.hide {
	display: none;
}

.modal_open {
	overflow: hidden;
	height: 100vh;
}

.lightbox .slick-prev {
	left: 50px !important;
}

.lightbox .slick-next {
	right: 50px !important;
}

/* Slider arrows */

.slick-arrow {
	width: 50px;
    height: 50px;
    background-color: #ffffff69 !important;
	background-image: url(/wp-content/uploads/2022/05/more-arrow-white.svg) !important;
	background-size: 15px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

.slick-arrow::before {
	display: none;
}

.slick-arrow.slick-next {
	right: -80px;
}

.slick-arrow.slick-prev {
	left: -80px;
	transform: translate(0, -50%) rotate(180deg);
	z-index: 1000;
}

@media screen and (max-width: 991px) {
	.vignettes_container .slick-prev {
		left: 41% !important;
	}

	.vignettes_container .slick-next {
		right: 41% !important;
	}
	
	.vignettes_container {
		padding: 0 0 50px 0;
	}
}

@media screen and (max-width: 767px) {
	.lightbox .slick-prev {
		right: 52% !important;
		bottom: 0 !important;
		top: unset !important;
		left: unset !important;
	}
	
	.lightbox .slick-next {
		left: 52% !important;
		bottom: 0 !important;
		top: unset !important;
	}
	
	.vignettes_container .slick-prev {
		left: 38% !important;
	}

	.vignettes_container .slick-next {
		right: 38% !important;
	}
	
	.lightbox img {
		width: 450px;
		height: 450px;
		object-fit: contain;
	}
	
	.slick-arrow.slick-prev {
		bottom: -120px;
		left: auto;
		right: 110px;
		top: auto;
	}
	
	.slick-arrow.slick-next {
		right: 40px;
    	bottom: -120px;
		top: auto;
	}
}

@media screen and (max-width: 480px) {
	
	.vignettes_container .slick-prev {
		left: 33% !important;
	}

	.vignettes_container .slick-next {
		right: 33% !important;
	}
	
	.vignettes_container .vignette_item {
		padding: 0 5px;
	}
	
	.lightbox img {
		width: 300px;
		height: 300px;
		object-fit: contain;
	}
	
	.lightbox .slick-prev {
		bottom: 50px !important;
	}
	
	.lightbox .slick-next {
		bottom: 50px !important;
	}
}