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
  • image01

    Creative

    Duet

  • image02

    Friendly

    Devil

  • image03

    Tranquilent

    Compatriot

  • image04

    Insecure

    Hussler

  • image05

    Loving

    Rebel

  • image06

    Passionate

    Seeker

  • image07

    Crazy

    Friend

CSS
<link href="assets/plugins/slider.nivo/nivo-slider.css" rel="stylesheet" type="text/css" />


JAVASCRIPT
<script type="text/javascript" src="assets/plugins/slider.nivo/jquery.nivo.slider.pack.js"></script>
<script type="text/javascript" src="assets/js/view/demo.nivo_slider.js"></script>
		
		
HTML
<!-- ELASTIC SLIDER -->
<div id="ei-slider" class="ei-slider" data-tumbwidth="100">

	<ul class="ei-slider-large nomargin">

		<!-- Slide 1 -->
		<li>
			<img src="assets/images/demo/1200x800/7-min.jpg" alt="image01" />
			<div class="ei-title">
				<h2>Creative</h2>
				<h3>Duet</h3>
			</div>
		</li>

		<!-- Slide 2 -->
		<li>
			<img src="assets/images/demo/1200x800/8-min.jpg" alt="image02" />
			<div class="ei-title">
				<h2>Friendly</h2>
				<h3>Devil</h3>
			</div>
		</li>

		<!-- Slide 3 -->
		<li>
			<img src="assets/images/demo/1200x800/9-min.jpg" alt="image03"/>
			<div class="ei-title">
				<h2>Tranquilent</h2>
				<h3>Compatriot</h3>
			</div>
		</li>

		<!-- Slide 4 -->
		<li>
			<img src="assets/images/demo/1200x800/10-min.jpg" alt="image04"/>
			<div class="ei-title">
				<h2>Insecure</h2>
				<h3>Hussler</h3>
			</div>
		</li>

		<!-- Slide 5 -->
		<li>
			<img src="assets/images/demo/1200x800/11-min.jpg" alt="image05"/>
			<div class="ei-title">
				<h2>Loving</h2>
				<h3>Rebel</h3>
			</div>
		</li>

		<!-- Slide 6 -->
		<li>
			<img src="assets/images/demo/1200x800/12-min.jpg" alt="image06"/>
			<div class="ei-title">
				<h2>Passionate</h2>
				<h3>Seeker</h3>
			</div>
		</li>

		<!-- Slide 7 -->
		<li>
			<img src="assets/images/demo/1200x800/13-min.jpg" alt="image07"/>
			<div class="ei-title">
				<h2>Crazy</h2>
				<h3>Friend</h3>
			</div>
		</li>

	</ul>

	<!-- Thumbnails -->
	<ul class="ei-slider-thumbs">
		<li class="ei-slider-element">Current</li>
		<li><a href="#">Slide 1</a><img src="assets/images/demo/150x99/7-min.jpg" alt="thumb01" /></li>
		<li><a href="#">Slide 2</a><img src="assets/images/demo/150x99/8-min.jpg" alt="thumb02" /></li>
		<li><a href="#">Slide 3</a><img src="assets/images/demo/150x99/9-min.jpg" alt="thumb03" /></li>
		<li><a href="#">Slide 4</a><img src="assets/images/demo/150x99/10-min.jpg" alt="thumb04" /></li>
		<li><a href="#">Slide 5</a><img src="assets/images/demo/150x99/11-min.jpg" alt="thumb05" /></li>
		<li><a href="#">Slide 6</a><img src="assets/images/demo/150x99/12-min.jpg" alt="thumb06" /></li>
		<li><a href="#">Slide 7</a><img src="assets/images/demo/150x99/13-min.jpg" alt="thumb07" /></li>
	</ul>
	<!-- /Thumbnails -->

</div>
<!-- /ELASTIC SLIDER -->