<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="description" content="">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- The above 4 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<!-- Title -->
<title>Colorlib App - App Landing Page</title>
<!-- Favicon -->
<link rel="icon" href="img/core-img/favicon.ico">
<!-- Core Stylesheet -->
<link href="style.css" rel="stylesheet">
<!-- Responsive CSS -->
<link href="css/responsive.css" rel="stylesheet">
</head>
<body>
<!-- Preloader Start -->
<div id="preloader">
<div class="colorlib-load"></div>
</div>
<!-- ***** Header Area Start ***** -->
<header class="header_area animated">
<div class="container-fluid">
<div class="row align-items-center">
<!-- Menu Area Start -->
<div class="col-12 col-lg-10">
<div class="menu_area">
<nav class="navbar navbar-expand-lg navbar-light">
<!-- Logo -->
<a class="navbar-brand" href="#">Ca.</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#ca-navbar" aria-controls="ca-navbar" aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button>
<!-- Menu Area -->
<div class="collapse navbar-collapse" id="ca-navbar">
<ul class="navbar-nav ml-auto" id="nav">
<li class="nav-item active"><a class="nav-link" href="#home">Home</a></li>
<li class="nav-item"><a class="nav-link" href="#about">About</a></li>
<li class="nav-item"><a class="nav-link" href="#features">Features</a></li>
<li class="nav-item"><a class="nav-link" href="#screenshot">Screenshot</a></li>
<li class="nav-item"><a class="nav-link" href="#pricing">Pricing</a></li>
<li class="nav-item"><a class="nav-link" href="#testimonials">Testimonials</a></li>
<li class="nav-item"><a class="nav-link" href="#team">Team</a></li>
<li class="nav-item"><a class="nav-link" href="#contact">Contact</a></li>
</ul>
<div class="sing-up-button d-lg-none">
<a href="#">Sign Up Free</a>
</div>
</div>
</nav>
</div>
</div>
<!-- Signup btn -->
<div class="col-12 col-lg-2">
<div class="sing-up-button d-none d-lg-block">
<a href="#">Sign Up Free</a>
</div>
</div>
</div>
</div>
</header>
<!-- ***** Header Area End ***** -->
<!-- ***** Wellcome Area Start ***** -->
<section class="wellcome_area clearfix" id="home">
<div class="container h-100">
<div class="row h-100 align-items-center">
<div class="col-12 col-md">
<div class="wellcome-heading">
<h2>Colorlib app</h2>
<h3>C</h3>
<p>Everything You Need. To Start Selling Online Beautifully</p>
</div>
<div class="get-start-area">
<!-- Form Start -->
<form action="#" method="post" class="form-inline">
<input type="email" class="form-control email" placeholder="name@company.com">
<input type="submit" class="submit" value="Get Started">
</form>
<!-- Form End -->
</div>
</div>
</div>
</div>
<!-- Welcome thumb -->
<div class="welcome-thumb wow fadeInDown" data-wow-delay="0.5s">
<img src="img/bg-img/welcome-img.png" alt="">
</div>
</section>
<!-- ***** Wellcome Area End ***** -->
<!-- ***** Special Area Start ***** -->
<section class="special-area bg-white section_padding_100" id="about">
<div class="container">
<div class="row">
<div class="col-12">
<!-- Section Heading Area -->
<div class="section-heading text-center">
<h2>Why Is It Special</h2>
<div class="line-shape"></div>
</div>
</div>
</div>
<div class="row">
<!-- Single Special Area -->
<div class="col-12 col-md-4">
<div class="single-special text-center wow fadeInUp" data-wow-delay="0.2s">
<div class="single-icon">
<i class="ti-mobile" aria-hidden="true"></i>
</div>
<h4>Easy to use</h4>
<p>We build pretty complex tools and this allows us to take designs and turn them into functional quickly and easily</p>
</div>
</div>
<!-- Single Special Area -->
<div class="col-12 col-md-4">
<div class="single-special text-center wow fadeInUp" data-wow-delay="0.4s">
<div class="single-icon">
<i class="ti-ruler-pencil" aria-hidden="true"></i>
</div>
<h4>Powerful Design</h4>
<p>We build pretty complex tools and this allows us to take designs and turn them into functional quickly and easily</p>
</div>
</div>
<!-- Single Special Area -->
<div class="col-12 col-md-4">
<div class="single-special text-center wow fadeInUp" data-wow-delay="0.6s">
<div class="single-icon">
<i class="ti-settings" aria-hidden="true"></i>
</div>
<h4>Customizability</h4>
<p>We build pretty complex tools and this allows us to take designs and turn them into functional quickly and easily</p>
</div>
</div>
</div>
</div>
<!-- Special Description Area -->
<div class="special_description_area mt-150">
<div class="container">
<div class="row">
<div class="col-lg-6">
<div class="special_description_img">
<img src="img/bg-img/special.png" alt="">
</div>
</div>
<div class="col-lg-6 col-xl-5 ml-xl-auto">
<div class="special_description_content">
<h2>Our Best Propositions for You!</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.</p>
<div class="app-dow