WHY SMARTY?

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas metus nulla, commodo a sodales sed, dignissim pretium nunc. Nam et lacus neque. Ut enim massa, sodales tempor convallis et, iaculis ac massa.

CONTACT INFO
  • Address: PO Box 21132, Here Weare St,
    Melbourne, Vivas 2355 Australia
  • Phone: 1-800-565-2390
  • Email: support@yourname.com

POWERFUL MULTIPURPOSE

Porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non.

PURCHASE NOW

WELCOME TO SMARTY

Porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam.

PURCHASE NOW
CSS
<link href="assets/plugins/slider.swiper/dist/css/swiper.min.css" rel="stylesheet" type="text/css" />


JAVASCRIPT
<script type="text/javascript" src="assets/plugins/slider.swiper/dist/js/swiper.min.js"></script>
<script type="text/javascript" src="assets/js/view/demo.swiper_slider.js"></script>
		
		
HTML
<section id="slider" class="fullheight">

	<!--
		SWIPPER SLIDER PARAMS
		
		data-effect="slide|fade|coverflow"
		data-autoplay="2500|false"
	-->
	<div class="swiper-container" data-effect="slide" data-autoplay="false">
		<div class="swiper-wrapper">

			<!-- SLIDE 1 -->
			<div class="swiper-slide">
				<div class="overlay dark-3"><!-- dark overlay [1 to 9 opacity] --></div>

				<div class="slider-video">
					<video poster="demo_files/images/video/back.jpg" preload="auto" loop autoplay muted>
						<source src='demo_files/images/video/back.webm' type='video/webm' />
						<source src='demo_files/images/video/back.mp4' type='video/mp4' />
					</video>
				</div>


				<div class="display-table">
					<div class="display-table-cell vertical-align-middle">
						<div class="container">

							<div class="row">
								<div class="col-md-5 col-xs-12">

									<h1 class="bold font-raleway wow fadeInUp" data-wow-delay="0.4s">POWERFUL MULTIPURPOSE</h1>
									<p class="lead font-lato fw-300 hidden-xs-down wow fadeInUp" data-wow-delay="0.6s">Porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non.</p>
									<a class="btn btn-default btn-lg hidden-xs-down wow fadeIn" data-wow-delay="1.5s" href="#">PURCHASE NOW</a>

								</div>
								<div class="col-md-7 hidden-xs-down text-right">
									<img class="img-fluid wow fadeInUp" data-wow-delay="1.5s" src="demo_files/images/fullscreen-video.png" alt="" />
								</div>
							</div>
				
						</div>
					</div>
				</div>
				
			</div>
			<!-- /SLIDE 1 -->

			<!-- SLIDE 2 -->
			<div class="swiper-slide" style="background-image: url('demo_files/images/1200x800/18-min.jpg');">
				<div class="overlay dark-5"><!-- dark overlay [1 to 9 opacity] --></div>
				
				<div class="display-table">
					<div class="display-table-cell vertical-align-middle">
						<div class="container">

							<div class="row">
								<div class="text-center col-md-8 col-xs-12 offset-md-2">

									<h1 class="bold font-raleway wow fadeInUp" data-wow-delay="0.4s">WELCOME TO SMARTY</h1>
									<p class="lead font-lato fw-300 hidden-xs-down wow fadeInUp" data-wow-delay="0.6s">Porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam.</p>
									<a class="btn btn-default btn-lg wow fadeIn" data-wow-delay="1.5s" href="#">PURCHASE NOW</a>

								</div>
							</div>
				
						</div>
					</div>
				</div>
				
			</div>
			<!-- /SLIDE 2 -->

		</div>

		<!-- Swiper Pagination -->
		<div class="swiper-pagination"></div>

		<!-- Swiper Arrows -->
		<div class="swiper-button-next"><i class="icon-angle-right"></i></div>
		<div class="swiper-button-prev"><i class="icon-angle-left"></i></div>
	</div>
		
</section>
<!-- /SLIDER -->