<!DOCTYPE html>
<html>
<head>
<title>Home</title>
<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="" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!--Custom Theme files-->
<link href="css/bootstrap.css" type="text/css" rel="stylesheet" media="all">
<link href="css/style.css" type="text/css" rel="stylesheet" media="all">
<link href="css/index.css" rel="stylesheet" type="text/css" media="all" />
<link rel="stylesheet" href="css/swipebox.css">
<!--//Custom Theme files-->
<!--js-->
<script src="js/jquery-1.11.1.min.js"></script>
<!--//js-->
<!--web-fonts-->
<link href='#css?family=Nova+Round' rel='stylesheet' type='text/css'>
<link href='#css?family=Roboto:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'>
<!--//web-fonts-->
<!--start-smooth-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>
<!--//end-smooth-scrolling-->
</head>
<body>
<!--banner-->
<div class="banner">
<div class="header"><!--header-->
<div class="container">
<nav class="navbar navbar-default">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<h1><a href="index.html">MAX</a></h1>
</div>
<!--navbar-header-->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li><a href="index.html" class="active">Home</a></li>
<li><a href="#about" class="scroll">About</a></li>
<li><a href="#features" class="scroll">Features</a></li>
<li><a href="#team" class="scroll">Team</a></li>
<li><a href="#portfolio" class="scroll">Portfolio</a></li>
<li><a href="#contact" class="scroll">Contact Us</a></li>
</ul>
<div class="clearfix"> </div>
</div>
</nav>
</div>
<div class="cd-main-header">
<ul class="cd-header-buttons">
<li><a class="cd-search-trigger" href="#cd-search"> <span></span></a></li>
</ul> <!-- cd-header-buttons -->
</div>
<div id="cd-search" class="cd-search">
<form action="#" method="post">
<input name="Search" type="search" placeholder="Search...">
</form>
</div>
</div>
<!--//header-->
<!--banner-text-->
<div class="banner-text">
<!--banner Slider starts Here-->
<script src="js/responsiveslides.min.js"></script>
<script>
// You can also use "$(window).load(function() {"
$(function () {
// Slideshow 3
$("#slider3").responsiveSlides({
auto: true,
pager: true,
nav: false,
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>
<h2>We Give the best solutions<br>for Improvement</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipi est.</p>
<a class="more hvr-bounce-to-right" href="#" data-toggle="modal" data-target="#myModal">Register Now</a>
</li>
<li>
<h3>Sollicitudin feugiat blandit<br>Quisque feugiat.</h3>
<p>Duis euismod massa ut sem fringilla blandit ipsum.</p>
<a class="more hvr-bounce-to-right" href="#" data-toggle="modal" data-target="#myModal">Register Now</a>
</li>
<li>
<h3>Nam erat purus, malesuada<br> Venenatis ut velit.</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipi est.</p>
<a class="more hvr-bounce-to-right" href="#" data-toggle="modal" data-target="#myModal">Register Now</a>
</li>
</ul>
</div>
</div>
<!--//banner-text-->
</div>
<!--//banner-->
<!--modal-sign-->
<div class="modal bnr-modal fade" id="myModal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
</div>
<section>
<div class="modal-body modal-spa">
<form action="#" method="post">
<div class="form-left">
<label>Name :</label>
<input type="text" name="Your Name" placeholder="Enter Your Name" required="">
</div>
<div class="form-right">
<label>Course :</label>
<select id="country" onchange="change_country(this.value)" class="frm-field required">
<option value="0">40 & 27-Mile Adults</option>
<option value="1">40 & 27-Mile Child</option>
<option value="2">8-Mile Family Ride</option>
<option value="3">Century</option>
<option value="4">Metric Century</option>
</select>
</div>
<div class="form-left">
<label>Date :</label>
<input type="date" name="Date" >
</div>
<div class="form-right">
<label>City :</label>
<input type="text" name="City" placeholder="Enter Your City" required="">
</div>
<div class="clearfix"> </div>
<label>Contact Info :</label>
<input type="text" name="Address" placeholder="Enter Contact Details" required="">
<input type="submit" value="Register Now">
</form>
</div>
</section>
</div>
</div>
</div>
<!--//modal-sign-->
<!--about-->
<div id="about" class="about">
<div class="container">
<div class="title">
<h3>About Us </h3>
<p>Duis euismod massa ut sem fringilla blandit. Proin vel enim nec ipsum finibus. </p>
</div>
<div class="about-row">
<div class="col-md-3 about-grids">
<span class="glyphicon glyphicon-stats effect-1" aria-hidden="true"></span>
<h4>Best Performance</h4>
<p>Itaque earum rerum hic tenetur a sapiente delectus
reiciendis maiores alias consequatur aut</p>
<h6> </h6>
</div>
<div class="col-md-3 about-grids">
<span class="glyphicon glyphicon-user effect-1" aria-hidden="true"></span>
<h4>Online Advisors</h4>
<p>Itaque earum rerum hic tenetur a sapiente delectus
reiciendis maiores alias consequatur aut</p>
<h6> </h6>
</div>
<div class="col-md-3 about-grids">
<span class="glyphicon glyphicon-list-alt effect-1" aria-hidden="true"></span>
<h4>New Technologies</h4>
<p>Itaque earum rerum hic tenetur a sapiente delectus
reiciendis maiores alias consequatur aut</p>
<h6> </h6>
</div>
<div class="col-md-3 about-grids">
<span class="glyphicon glyphicon-check effect-1" aria-hidden="true"></span>
<h4>Security & Privacy</h4>
<p>Itaque earum rerum hic tenetur a sapiente delectus
reiciendis maiores alias consequatur aut</p>
<h6> </h6>
</div>
<div class="clerfix"> </div>
</div>
</div>
</div>
<!--//about-->
<!--features-->
<div id="features" class="features">
<div class="container">