###### 💖 Fall in love with the City

# Modern Luxury In Manhattan

Reserve Today

# Taking luxury hospitality to new heights

Take Me There

    <!-- =======================
    Main Banner START -->
    <section class="py-0">
    	<div class="container-fluid">
    		<div class="row">
    			<div class="col-lg-11 mx-auto">
    				<!-- Slider START -->
    				<div class="tiny-slider arrow-round arrow-blur arrow-hover rounded-3 overflow-hidden">
    					<div class="tiny-slider-inner" data-gutter="0" data-arrow="true" data-dots="false" data-items="1">
    						<!-- Card item START -->
    						<div class="card overflow-hidden h-400px h-sm-600px rounded-0" style="background-image:url(assets/images/category/hotel/06.jpg); background-position: center left; background-size: cover;">
    							<!-- Background dark overlay -->
    							<div class="bg-overlay bg-dark opacity-3"></div>
    							<!-- Card image overlay -->
    							<div class="card-img-overlay d-flex align-items-center">
    								<div class="container">
    									<div class="row">
    										<div class="col-11 col-lg-7">
    											<h6 class="text-white fw-normal mb-0">💖 Fall in love with the City</h6>
    											<!-- Title -->
    											<h1 class="text-white display-6">Modern Luxury In Manhattan</h1>
    											<a href="#" class="btn btn-primary mb-0">Reserve Today</a>
    										</div>
    									</div>
    								</div>
    							</div>
    						</div>
    						<!-- Card item END -->

    						<!-- Card item START -->
    						<div class="card overflow-hidden h-400px h-sm-600px bg-parallax text-center rounded-0"  data-jarallax-video="https://www.youtube.com/watch?v=71V3HawWXU4">
    							<!-- Background dark overlay -->
    							<div class="bg-overlay bg-dark opacity-3"></div>
    							<!-- Card image overlay -->
    							<div class="card-img-overlay d-flex align-items-center p-3 p-sm-4">
    								<div class="container w-100 my-auto">
    									<div class="row justify-content-center">
    										<div class="col-11 col-lg-8">
    											<!-- Title -->
    											<h1 class="text-white">Taking luxury hospitality to new heights</h1>
    											<a href="#" class="btn btn-dark mb-0">Take Me There</a>
    										</div>
    									</div>
    								</div>
    							</div>
    						</div>
    						<!-- Card item END -->
    					</div>
    				</div>
    				<!-- Slider END -->
    			</div>
    		</div>
    	</div>
    </section>
    <!-- =======================
    Main Banner END -->

Copy-paste the stylesheet `<link>` into your `<head>` to load the CSS.

    <link rel="stylesheet" type="text/css" href="assets/vendor/tiny-slider/tiny-slider.css">

Copy-paste the following `<script>` near the end of your pages under Vendors to enable it.

    <script src="assets/vendor/tiny-slider/tiny-slider.js"></script>
    <script src="assets/vendor/jarallax/jarallax.min.js"></script>
    <script src="assets/vendor/jarallax/jarallax-video.min.js"></script>