.bannerWithVideoOverlay_banner {
    position: relative;
    width: 100%;
    max-width: 1300px;
    height: 300px;
    border-radius: 20px;
    overflow: hidden;
}

.bannerWithVideoOverlay_banner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
}

.iframe-bannerVideo {
    width: 400px; /* You can adjust this percentage to fit your design */
    height: 200px; /* Make height equal to width for a square shape */
    border: none;
    border-radius: 10px; /* Optional: Rounded corners */
    position: absolute; /* Stacks on top of the banner */
    top: 50px; /* Adjust as necessary */
    right: 0; 
    margin-right:50px;
}

	/* Mobile styles */
	@media (max-width: 1024px) {
	    .bannerWithVideoOverlay_banner {
	        height: auto; /* Let the height adjust based on content */
	        max-height: 100vh; /* Limit to viewport height */
	        position: static;
	    }
	    
	    .bannerWithVideoOverlay_banner img {
	        width: 100%; /* Full width for responsiveness */
	        height: auto; /* Maintain aspect ratio */
	        object-fit: cover; /* Ensure the image covers the container without stretching */
	        max-width: 1000px; /* Set maximum width to avoid distortion */
	        max-height: 900px; /* Set maximum height for consistency */
	        border-radius: 10px; /* Rounded corners if desired */
	    }
	    
	    .iframe-bannerVideo {
	        width: 100%; /* Subtract the total horizontal margins from width */
	        height: auto; /* Maintain aspect ratio */
	        top: 90%;
	        left: 50%;
	        transform: translateX(-50%); /* Center the iframe */
	        border-radius: 20px;
	        aspect-ratio: 16 / 9;
	         margin-right:0;
	    }
	    .floatingBannerVideoMarginPadding{
	    	margin: 0 0 50% 0;
	    	padding: 0 25px !important;
	    }
	   
	}
}