﻿.slider-for img.img-fluid,
.slider-for video {
	width: 100%;
	height: 100% !important;
	max-width: none;
	object-fit: contain;
	background-color: #000;
	display: block;
}

.slider-for,
.slider-for .slick-list,
.slider-for .slick-track,
.slider-for .slick-slide,
.slider-for .slick-slide > div {
	height: 500px;
}


	.slider-for .slick-list,
	.slider-for .slick-track,
	.slider-for .slick-slide {
		height: 100%;
	}

		.slider-for .slick-slide > div {
			height: 100%;
		}

	.slider-for img,
	.slider-for video {
		width: 100%;
		height: 100%;
		object-fit: contain;
		background-color: #000;
		display: block;
	}

.slider-container {
	width: 60%;
	max-width: 900px;
	margin: 0 auto;
	position: relative;
}

.slider-for {
	position: relative;
	min-height: 400px; /* Prevents stacking while images load */
}

	.slider-for img, .slider-nav img {
		display: block;
		width: 100%;
		height: auto;
		cursor: pointer;
	}

.slider-nav {
	margin-top: 20px;
}

	.slider-nav .slick-slide {
		margin: 0 10px;
	}

	.slider-nav .slick-prev, .slider-nav .slick-next {
		display: flex !important;
		align-items: center;
		justify-content: center;
		background-color: rgba(0, 0, 0, 0.5);
		border-radius: 50%;
		color: white;
		font-size: 20px;
		width: 30px;
		height: 30px;
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		z-index: 2;
	}

	.slider-nav .slick-prev {
		left: -40px;
	}

	.slider-nav .slick-next {
		right: -40px;
	}

	.slider-nav .slick-slide {
		margin: 0 10px;
	}

.caption {
	text-align: center;
	font-size: 16px;
	color: white;
	background-color: rgba(0, 0, 0, 0.5);
	padding: 10px;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	box-sizing: border-box;
}

.slider-for .slick-prev, .slider-for .slick-next {
	display: none !important;
}

.slick-prev, .slick-next {
	background-color: rgba(0, 0, 0, 0.5);
	border-radius: 50%;
	color: white;
	font-size: 30px;
	width: 40px;
	height: 40px;
	display: flex !important;
	align-items: center;
	justify-content: center;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 1;
}

.slider-nav .slick-prev {
	left: -50px;
}

.slider-nav .slick-next {
	right: -50px;
}

.slick-prev:before, .slick-next:before {
	content: '';
}
