<!DOCTYPE html>
<html>
<head>
<title>Home</title>
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
<link href='http://fonts.useso.com/css?family=Open+Sans:400,300,600,700,800' rel='stylesheet' type='text/css'>
<link href='http://fonts.useso.com/css?family=Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'>
<!-- js -->
<script src="js/jquery.min.js"></script>
<!-- //js -->
<!-- for-mobile-apps -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Princi_Gym Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template,
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false);
function hideURLbar(){ window.scrollTo(0,1); } </script>
<!-- //for-mobile-apps -->
<!-- hover-effects -->
<!-- //hover-effects -->
<!-- start-smoth-scrolling -->
<script type="text/javascript" src="js/move-top.js"></script>
<script type="text/javascript" src="js/easing.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$(".scroll").click(function(event){
event.preventDefault();
$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
});
});
</script>
<!-- start-smoth-scrolling -->
<!--start-top-nav-script-->
<!--End-top-nav-script-->
</head>
<body>
<!-- header -->
<div class="header">
<div class="container">
<div class="header-top-left" id="home">
<ul>
<li class="activ"><a href="#">LAST NOTICE</a></li>
<li>Aliquam sit amet gravida ipsum,vitae scelerisque mi.Maecenas ullamcorper in
metus a ullamcorper.Sed dictum neque </li>
</ul>
</div>
<div class="header-top-right">
<p>Phone Number:<span> 043-234-3453</span></p>
</div>
<div class="clearfix"> </div>
<div class="head-logo">
<a href="index.html"><span> </span></a>
</div>
<div class="header-top">
<div class="navigation">
<span class="menu"></span>
<ul class="navig">
<li><a href="index.html" class="act">Home</a></li>
<li class="plan active"><a href="single.html">CLASSES</a>
<ul class="sub-nav sub">
<li><a href="single.html">DROP ITEM1</a></li>
<li><a href="single.html">DROP ITEM2</a></li>
</ul>
</li>
<li><a href="404.html">PAGES</a></li>
<li><a href="news.html">NEWS</a></li>
<li><a href="gallery.html">GALLERY</a></li>
<li><a href="trainers.html">TRAINERS</a></li>
<li><a href="contact.html">CONTACT</a></li>
<li><a href="#" class="home-box">CONTACT</a></li>
<div class="clearfix"> </div>
</ul>
</div>
<div class="search">
<form>
<input type="text" placeholder="Type and search..." required=" ">
</form>
</div>
<div class="clearfix"> </div>
</div>
</div>
</div>
<!-- script-for-menu -->
<script>
$("span.menu").click(function(){
$(" ul.navig").slideToggle("slow" , function(){
});
});
</script>
<!-- script-for-menu -->
<!-- //header -->
<!-- banner -->
<div class="banner">
<div class="container">
<!-- Slider-starts-Here -->
<script src="js/responsiveslides.min.js"></script>
<script>
// You can also use "$(window).load(function() {"
$(function () {
// Slideshow 4
$("#slider3").responsiveSlides({
auto: true,
pager: true,
nav: true,
speed: 500,
namespace: "callbacks",
before: function () {
$('.events').append("<li>before event fired.</li>");
},
after: function () {
$('.events').append("<li>after event fired.</li>");
}
});
});
</script>
<!--//End-slider-script -->
<div id="top" class="callbacks_container">
<ul class="rslides" id="slider3">
<li>
<div class="banner-info">
<p class="para">LATEST CLASS</p>
<h4>FITNESS AND HEALTH</h4>
<p class="para1">Lorem ipsum dolor sit amet, consectetur adipiscin
<span>elit. In ut turpis a erat consectetur euismod.</span>
Suspendisse massa magnet and its a du dolor.</p>
<div class="skills">
<div class="skill" style="width:40%"> </div>
</div>
</div>
</li>
<li>
<div class="banner-info">
<p class="para">FIRST CLASS</p>
<h4>FITNESS</h4>
<p class="para1">aliquam ipsum ipsum mollis In ut turpis euismod.<span>
Sollicitudin viverra, vel varius erat consectetur</span> eget a sit mollis ante morbi sed.</p>
<div class="skills">
<div class="skill" style="width:55%"> </div>
</div>
</div>
</li>
<li>
<div class="banner-info">
<p class="para">SECOND CLASS</p>
<h4>HEALTH</h4>
<p class="para1">Lorem ipsum dolor sit amet, consectetur adipiscin
<span>elit. In ut turpis a erat consectetur euismod.</span>
Suspendisse massa magnet and its a du dolor.</p>
<div class="skills">
<div class="skill" style="width:75%"> </div>
</div>
</div>
</li>
<li>
<div class="banner-info">
<p class="para">FOURTH CLASS</p>
<h4>FITNESS AND HEALTH</h4>
<p class="para1">aliquam ipsum ipsum mollis In ut turpis euismod.<span>
Sollicitudin viverra, vel varius erat consectetur</span> eget a sit mollis ante morbi sed.</p>
<div class="skills">
<div class="skill" style="width:95%"> </div>
</div>
</div>
</li>
</ul>
</div>
<!-- Slider-ends-Here -->
</div>
</div>
<!-- //banner -->
<!-- banner-bottom -->
<div class="banner-bottom">
<div class="container">
<div class="banner-bottom-left">
<h4>CARDIOVASCULAR EXERCISE</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Cras euismod justo sit amet porttitor viverra.
In hac habitasse platea dictumst. In cursus, massa id aliquet volutpat,
turpis dui fermentum purus, tempor rhoncus mauris urna sed tortor.
<span>Aliquam in dolor eu ipsum elementum auctor vitae eget felis.
Integer feugiat rutrum accumsan. Donec velit eros, eleifend vitae nisi nec,
mattis auctor dui. Aliquam erat volutpat.
Curabitur eu felis ac augue mollis auctor hendrerit ut velit.
Maecenas tempus viverra sollicitudin.</span></p>
<div class="get">
<a href="#">GET DEMO</a>
</div>
<div class="buy">
<a href="#">BUY NOW</a>
</div>
<div class="clearfix"> </div>
</div>
<div class="banner-bottom-right">
<div class="fig">
<img src="images/2.png" alt=" " />
</div>
<div class="fig1">
<img src="images/3.png" alt=" " />
</div>
<div class="clearfix"> </div>
</div>
<div class="clearfix"> </div>
</div>
</div>
<div class="watch-demo">
<div class="container">
<div class="banner-bottom-right1">
<h4>GOOD FOR HEALTH</h4>
<p class="para">Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Cras euismod justo sit amet porttitor viverra. In hac
habitasse platea dictumst. In cursus, massa id aliquet volutpat,
turpis dui fermentum purus, tempor rhoncus mauris urna sed tortor.
<span> Aliquam in dolor eu ipsum elementum auctor vitae eget felis.
Integer feugiat rutrum accumsan.</span></p>
<div class="watch">