/*  ==========================================================================
V3 Homepage
========================================================================== */
.header-rshop-v003 {
	width: 100%; /* Make sure the container takes the full width of the parent */
	height: auto; /* Adjust height to maintain aspect ratio or set specific height */
	overflow: hidden; /* Hide overflow, if necessary */
	position: relative; /* If you need to position child elements inside */
}
.header-rshop-v003 img {
	width: 100%; /* Make the image take the full width of the container */
	height: auto; /* Maintain the aspect ratio */
	display: block; /* Remove bottom gap if any due to inline-block spacing */
}
.v003-container {
	width: 100%;
	margin: 0;
	padding: 10px 0;
	background-color: #000000;
}
.v003-section {
	overflow: hidden;
}

.v003-items {
	display: flex;
	justify-content: flex-start;
	flex-wrap: nowrap;
	list-style: none;
	margin: 0;
	padding: 0;
}

.v003-item {
	min-width: 400px;
	height: 400px;
	margin: 0;
	line-height: 190px;
	text-align: center;
	font-size: 24px;
	color: white;
}
.spacer {
	height: 100vh;
	text-align: center;
	line-height: 300px;
	display: flex;
}
.spacer img {
	display: flex;
	width: 100%;
	height: auto;
	object-fit: cover;
}

@media (max-width: 768px) {
	.header-rshop-v003 {
		height: 400px; /* Full height of the viewport */
		padding: 0; /* Optional: Remove padding if any */
	}

	.header-rshop-v003 img {
		width: 100vw; /* Full width of the viewport */
		height: 400px; /* Full height of the viewport */
		object-fit: cover; /* Ensure the image covers the entire container while maintaining aspect ratio */
		object-position: center; /* Center the image */
	}

	.header-rshop-v003 img.img-right {
		object-position: right;
	}

	.header-rshop-v003 img.img-left {
		object-position: left;
	}

}
