<!DOCTYPE html>
<html lang="en">
	<head>
		<!--- Basic Page Needs  -->
		<meta charset="utf-8">
		<title>CAPS</title>
		<meta name="description" content="">
		<meta name="author" content="">
		<meta name="keywords" content="">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">

		<!-- Mobile Specific Meta  -->
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<!-- Google Fonts -->
		<link href="https://fonts.googleapis.com/css?family=Montserrat|Raleway:300,400,600,700" rel="stylesheet"> 

		<!-- CSS -->
		<link rel="stylesheet" href="/assets/css/animate.min.css">
		<link rel="stylesheet" href="/assets/css/bootstrap.min.css">
		<link rel="stylesheet" href="/assets/css/owl.carousel.min.css">
		<link rel="stylesheet" href="/assets/css/owl.theme.min.css">
		<link rel="stylesheet" href="/assets/css/font-awesome.min.css">
		<link rel="stylesheet" href="/assets/css/default.css">
		<link rel="stylesheet" href="/assets/css/typography.css">
		<link rel="stylesheet" href="/assets/css/style.dark.css">
		<link rel="stylesheet" href="/assets/css/responsive-dark.css">

		<!-- Favicon -->
		<link rel="shortcut icon" type="image/png" href="/assets/img/logo-sm.png">

		<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
		<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
		<!--[if lt IE 9]>
		<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
		<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
		<![endif]-->
	</head>
	<body data-spy="scroll" data-target="#scroll-menu" data-offset="120" class="dark">
		<!-- Preloader Starts -->
		<div class="preloader-area">
			<div class="preloader-inner">
				<div class="preloader">
				    <span></span>
				    <span></span>
				</div>
			</div>
		</div>
		<!-- Preloader Ends -->
		<!-- Header Area Starts -->
		<header id="home">
			<div class="navbar-area">
				<nav class="navbar navbar-default navbar-fixed-top wow fadeInDown" data-wow-delay="0.2s" id="scroll-menu">
			      	<div class="container">
			        	<div class="navbar-header">
			          		<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
			            		<span class="sr-only">Toggle navigation</span>
					            <span class="icon-bar"></span>
					            <span class="icon-bar"></span>
					            <span class="icon-bar"></span>
				          	</button>
				          	<a class="navbar-brand" href="index.html"><img src="/assets/img/logo-dark.png" alt="MobileApp"></a>
				        </div>
				        <div id="navbar" class="navbar-collapse collapse">
				          	<ul class="nav navbar-nav navbar-right">
				            	<li class="active"><a href="#home" class="smoothscroll">HOME</a></li>
				            	<li><a href="#feature" class="smoothscroll">FEATURE</a></li>
				            	<li><a href="#pricing" class="smoothscroll">PLANS</a></li>
				            	<li><a href="#download" class="smoothscroll">DOWNLOAD</a></li>
				            	<li><a href="#contact" class="smoothscroll">CONTACT</a></li>
                                                <li><a href="http://apps.capstech.co" class="smoothscrollj">LOGIN</a></li>
				          	</ul>
				        </div>
			      	</div>
			    </nav>
			</div>
		</header>
		<!-- Header Area Ends -->

		<!-- Hero Area Starts -->
		<div class="hero-area" id="dark-hero-area">
			<div class="container">
					<div class="row">
						<div class="col-xs-12 col-md-5">
							<div class="hero-caption">
								<div class="hero-caption-inner">
									<p class="sublead wow fadeInDown" data-wow-delay="1s">Complete</p>
									<h1 class="lead"></h1>
									<p class="lead-text"></p>
								</div>
							</div>
						</div>
						<div class="col-xs-12 col-sm-4 col-sm-offset-3">
							<div class="dark-mockup-slider-area">
								<div class="dark-mockup-slider">
									<div id="dark-mockup-slide" class="owl-carousel owl-theme dark-mockup-slide wow fadeIn" data-wow-delay="0.2s">
										<div class="item"><img src="/assets/img/dark-slide-1.png" alt=""></div>
										<div class="item"><img src="/assets/img/dark-slide-2.png" alt=""></div>
										<div class="item"><img src="/assets/img/dark-slide-3.png" alt=""></div>
										<div class="item"><img src="/assets/img/dark-slide-4.png" alt=""></div>
									</div>
									<span class="vr-line"></span>
								</div>
							</div>
						</div>
					</div>
				</div>
		</div>
		<!-- Hero Area Ends -->

		<!-- Apps Feature Area Starts -->
		<div id="feature" class="feature-area inner-padding">
			<div class="container">
				<div class="row">
					<div class="col-xs-12">
						<div class="section-title text-center wow fadeInDown">
							<span>CAPS FEATURES</span>
							<h2>Quality of Drive Experience is our Goal </h2>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-xs-12 col-md-4 feature-left">
						<div data-value="tab-1" class="single-feature-item text-right active wow fadeInUp">
							<h4>Trip Monitoring</h4>
							<p>You are not alone on the road. Enhance your safety by analyzing what others drivers are doing around you.</p>
						</div>
						<div data-value="tab-2" class="single-feature-item text-right  wow fadeInUp">
							<h4>TRAFFIC Intelligence</h4>
							<p>In the ecosystem of how to get there view self-drive, Lyft or Uber, we help optimize your option.</p>
						</div>
						<div data-value="tab-3" class="single-feature-item text-right wow fadeInUp">
							<h4>Dash Verify</h4>
							<p>What you see on your dash augmented by our app. It is good to at least know your speed is correct.</p>
						</div>
					</div>
					<div class="col-xs-12 col-md-4">
						<div class="single-feature-slide">
							<img id="tab-1" class="tab-img active" src="/assets/img/dark-slide-1.png" alt="Feature Slide">
							<img id="tab-2" class="tab-img" src="/assets/img/dark-slide-2.png" alt="Feature Slide">
							<img id="tab-3" class="tab-img" src="/assets/img/dark-slide-3.png" alt="Feature Slide">
							<img id="tab-4" class="tab-img" src="/assets/img/dark-slide-4.png" alt="Feature Slide">
							<img id="tab-5" class="tab-img" src="/assets/img/dark-slide-5.png" alt="Feature Slide">
							<img id="tab-6" class="tab-img" src="/assets/img/dark-slide-6.png" alt="Feature Slide">
						</div>
					</div>
					<div class="col-xs-12 col-md-4 feature-right">
						<div data-value="tab-4" class="single-feature-item wow fadeInUp">
							<h4>Environment Guard</h4>
							<p>Our system consumes your location risk to enhance your awareness and preparedness.</p>
						</div>
						<div data-value="tab-5" class="single-feature-item wow fadeInUp">
							<h4>Passive Secure</h4>
							<p>Protection when your car is not in motion. Dangers like wrong or hacked start is covered.</p>
						</div>
						<div data-value="tab-6" class="single-feature-item wow fadeInUp">
							<h4>24/7 LIVE SUPPORT</h4>
							<p>We are here all the time by chats, email or phone to answer your questions.</p>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!-- Apps Feature Area Ends -->

		<!-- Pricing Area Starts -->
		<div id="pricing" class="pricing-area inner-padding bg-light">
			<div class="container">
				<div class="row">
					<div class="col-xs-12 col-md-5">
						<div class="section-title title-left wow fadeInDown">
							<span class="small">PLAN</span>
							<h2>Individual of Company</h2>
						</div>
						<div class="pricing-content">
							<p class="pill-title">You Are</p>
							<ul class="pricing-pill wow fadeIn">
								<li class="active" data-value="individual"><span><i class="fa fa-user"></i> | Individual</span></li>
								<li data-value="company"><span><i class="fa fa-users"></i> | Company</span></li>
							</ul>
							<p class="wow fadeIn">Thus much I thought proper to tell you in relation to yourself, and to the trust I reposed in you.</p>
							<p class="fade-text wow fadeIn">Have a bigger team? <a href="#">Let‘s talk</a></p>
						</div>
					</div>
					<div class="col-xs-12 col-md-7">
						<ul class="pricing-table wow slideInRight">
							<li id="individual" class="active">
								<h2 class="lead-title">Individual</h2>
								<span class="price-tag">Free</span>
								<h4 class="sublead">Build your schedule <br> every day</h4>
								<ul class="pricing-list">
									<li><p>Unlimeted events</p></li>
									<li><p>Connect Dropbox & Evernote</p></li>
									<li><p>Personal Assistant</p></li>
								</ul>
								<a href="http://apps.capstech.co" class="btn btn-default btn-outline-megento"><i class="fa fa-paper-plane"></i> | Get Started</a>
							</li>
							<li id="company">
								<h2 class="lead-title">Pro</h2>
								<span class="price-tag">$4.99</span>
								<h4 class="sublead">Make your life <br> better</h4>
								<ul class="pricing-list">
									<li><p>Unlimeted events</p></li>
									<li><p>Connect Dropbox & Evernote</p></li>
									<li><p>Personal Assistant</p></li>
								</ul>
								<a href="http://apps.capstech.co" class="btn btn-default btn-outline-megento"><i class="fa fa-briefcase"></i> | Make me a Pro</a>
							</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
		<!-- Pricing Area Ends -->

		<!-- Subscribe Area Starts -->
		<div class="subscribe-area inner-padding">
			<div class="container">
				<div class="row">
					<div class="col-xs-12 col-sm-6 col-sm-offset-3 text-center wow fadeInUp">
						<h4>Connect with people using CAPS now</h4>
						<form action="#">
							<p><input type="email" class="form-control form-subscribe" name="email" placeholder="Email to subscribe"></p>
							<button class="btn btn-default btn-fill-megento"><i class="fa fa-envelope"></i> | Subscribe</button>
						</form>
					</div>
				</div>
			</div>
		</div>
		<!-- Subscribe Area Ends -->

		<!-- Download App Area Starts -->
		<div id="download" class="download-area inner-padding">
			<div class="container">
				<div class="row">
					<div class="col-xs-12">
						<div class="section-title-2 wow fadeInDown">
							<h2>Get this Application</h2>
							<span>Swip  .  Get Matched  .  Connect</span>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-xs-12 text-center">
						<div class="store-icon wow fadeIn">
							<a href="#"><img src="/assets/img/app-store.png" alt="Apple"></a>
							<a href="#"><img src="/assets/img/google-store.png" alt="Google Play"></a>
							<a href="#"><img src="/assets/img/windows-store.png" alt="Windows"></a>
							<a href="#"><img src="/assets/img/amazon-store.png" alt="Amazon"></a>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-xs-12">
						<div class="download-app text-center wow fadeIn">
							<img src="/assets/img/dark-slide-6.png" alt="Mobile Slide">
						</div>
					</div>
				</div>
			</div>
		</div>
		<!-- Download App Area Ends -->
		
		<!-- Footer Area Starts -->
		<footer>
			<div id="contact" class="footer-area">
				<div class="container">
					<div class="row">
						<div class="col-xs-12">
							<div class="footer-logo">
								<h2>CAPS <span class="thin">Tech</span></h2>
								<p>On guard for your drive with improved mobility experience</p>
							</div>
						</div>
					</div>
					<div class="row">
						<div class="col-xs-12 col-md-5">
							<div class="footer-box">
								<h2>ON YOUR RIDE'S GUARD ALWAYS</h2>
								<p>This is Photoshop's version  of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum, nec sagittis sem </p>
							</div>
						</div>
						<div class="col-xs-12 col-sm-1 hidden-xs hidden-sm"></div>
						<div class="col-xs-12 col-sm-4 col-md-2">
							<div class="footer-box">
								<h4>Learn More</h4>
								<ul class="footer-menu">
									<li><a href="#">How it works?</a></li>
									<li><a href="#">Meeting tools</a></li>
									<li><a href="#">Live striming</a></li>
									<li><a href="#">Contact method</a></li>
								</ul>
							</div>
						</div>
						<div class="col-xs-12 col-sm-4 col-md-2">
							<div class="footer-box">
								<h4>About Us</h4>
								<ul class="footer-menu">
									<li><a href="#">About us</a></li>
									<li><a href="#">Features</a></li>
									<li><a href="#">Privacy police</a></li>
									<li><a href="#">Terms & Conditions</a></li>
								</ul>
							</div>
						</div>
						<div class="col-xs-12 col-sm-4 col-md-2">
							<div class="footer-box">
								<h4>Support</h4>
								<ul class="footer-menu">
									<li><a href="#">F.A.Q.</a></li>
									<li><a href="#">Contact us</a></li>
									<li><a href="#">Live chat</a></li>
									<li><a href="#">Phone call</a></li>
								</ul>
							</div>
						</div>
					</div>
					<div class="row">
						<div class="col-xs-12 col-sm-5">
							<div class="download-link">
								<p><a href="#" class="btn btn-default btn-fill-megento"><i class="fa fa-download"></i> | Download Now</a></p>
								<span>Available in:</span>  
								<a href="#"><i class="fa fa-android fa-2x"></i></a> 
								<a href="#"><i class="fa fa-apple fa-2x"></i></a>
								<a href="#"><i class="fa fa-windows fa-2x"></i></a>
							</div>
						</div>
						<div class="col-xs-12 col-sm-3 hidden-xs"></div>
						<div class="col-xs-12 col-sm-4">
							<div class="contact-content">
								<div class="vr-title-area">
									<h4>Contact Us</h4>
								</div>
								<h3>CAPS <span class="thin">Tech</span></h3>
								<p>Email :contact@capstech.co</p>
								<p>Phone : +89 883 3435 343</p>
								<ul class="social-icon">
									<li><a href="#" data-toggle="tooltip" data-placement="bottom" title="Facebook"><i class="fa fa-facebook"></i></a></li>
									<li><a href="#" data-toggle="tooltip" data-placement="bottom" title="Twitter"><i class="fa fa-twitter"></i></a></li>
									<li><a href="#" data-toggle="tooltip" data-placement="bottom" title="YouTube"><i class="fa fa-youtube"></i></a></li>
								</ul>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="copyright-area">
				<div class="container">
					<div class="row">
						<div class="col-xs-12 col-md-6 col-md-offset-6">
							<span>Copyright &copy;2017. All right reserved to <a href="/" target="_self">capstech</a></span>
						</div>
					</div>
				</div>
			</div>
		</footer>
		<!-- Footer Area Ends -->
		
		<!-- Scripts -->
		<script src="/assets/js/jquery-1.11.3.min.js"></script>
		<script src="/assets/js/wow.min.js"></script>
		<script src="/assets/js/bootstrap.min.js"></script>
		<script src="/assets/js/owl.carousel.min.js"></script>
		<script src="/assets/js/typed.min.js"></script>
		<script src="/assets/js/theme.js"></script>
		
	</body>
</html>