Files
kuboard-press/.vuepress/public/landing/home4.html
2019-10-20 13:57:43 +08:00

969 lines
58 KiB
HTML
Executable File
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="keywords" content="saas,crm,bootstrap4,template,download">
<meta name="description" content="OhDearCRM is a Bootstrap4 Responsive Template for Startups,SaaS Companies and Agencies.">
<meta name="author" content="">
<title>SaaS & CRM App Landing Page Template - OhDearCRM</title>
<link rel="icon" href="images/logo.png">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:400,400i,500,500i|Roboto:500,700">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="css/bootstrap.min.css">
<!-- Plugins -->
<!-- Venobox Lightbox slider -->
<link rel="stylesheet" href="css/venobox.css">
<!-- Slick Slider-->
<link rel="stylesheet" href="js/slick/slick.css">
<link rel="stylesheet" href="js/slick/slick-theme.css">
<!-- AOS Animate -->
<link href="https://cdn.rawgit.com/michalsnik/aos/2.1.1/dist/aos.css" rel="stylesheet">
<!-- Custom Css -->
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/components.css">
</head>
<body class="overflow-hidden">
<!-- Navigation -->
<div id="menu_area" class="menu-area fixed-top">
<div class="container">
<div class="row">
<nav class="navbar navbar-light navbar-expand-lg mainmenu">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<a class="navbar-brand" href="index.html">CRM
<!-- <img src="images/logo.png" class="logo" alt="" height="60">-->
</a>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto">
<li class="nav-item"> <a class="nav-link" href="#features">Features</a> </li>
<li class="nav-item"> <a class="nav-link" href="#pricing">Pricing </a> </li>
<li class="nav-item"> <a class="nav-link" href="#webinars">Webinars</a> </li>
<li class="nav-item"> <a class="nav-link" href="blog.html">Blog</a> </li>
<li class="nav-item dropdown">
<a class="dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Pages</a>
<ul class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown">
<li><a href="index.html">Home Page 1</a></li>
<li><a href="home2.html">Home Page 2</a></li>
<li><a href="home3.html">Home Page 3</a></li>
<li><a href="home4.html">Home Page 4</a></li>
<li><a href="blog.html">Blog</a></li>
<li><a href="blog-single.html">Blog Single</a></li>
</ul>
</li>
<li class="nav-item"> <a class="btn btn-secondary text-white btn-round btn-nav" data-toggle="modal" data-target="#signup-modal">Signup</a> </li>
<li class="nav-item"> <a class="btn btn-primary btn-shadow text-white btn-round btn-nav" data-toggle="modal" data-target="#signin-modal">Login</a> </li>
</ul>
</div>
</nav>
</div>
</div>
</div>
<!-- /Navigation -->
<!-- Header -->
<header class="fixed-top-added overflow-x">
<div class="container">
<div class="row">
<div class="col-md-5">
<div class="hero-content">
<h1 class="text-primary">AI Driven CRM for your Sales Force</h1>
<p class="text-primary mt-3">Close more deals than ever, automatice lead captures,in-built phone,smart alerts with push notifcations.</p>
<ul class="pair-btns-list">
<li><a href="home3.html" class="cbtn btn-grad btn-shadow btn-width">Get Started</a></li>
<li><a class="cbtn btn-grad-s btn-shadow btn-width venobox vbox-item video-play" data-autoplay="true" data-vbtype="video" href="https://youtu.be/kubGCSj5y3k">Live Demo</a></li>
</ul>
</div>
</div>
<div class="col-md-7">
<img src="images/mock2.png" alt="" class="hero-img img-fluid cs-fade-in-up">
</div>
</div>
</div>
<div class="bg-shape"></div>
<div class="bg-circle"></div>
<div class="bg-circle-two"></div>
</header>
<!-- /Header -->
<!-- Material Pills <Start> -->
<div class="bg-gray py-80">
<div class="container">
<div class="row">
<div class="col-sm-12">
<div class="section-head text-center">
<h1 class="text-primary">Why CRM?</h1>
<p class="text-secondary">Close more deals than ever, automatice lead captures,in-built phone,smart alerts with push notifcations.</p>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<ul class="nav nav-pills material-pills nav-border-tabs nav-fill" id="pills-tab" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="cs-pills-one-tab" data-toggle="pill" href="#cs-pills-one" role="tab" aria-controls="cs-pills-one" aria-selected="true">Use Built-in<br>
Phone and Email</a>
</li>
<li class="nav-item">
<a class="nav-link" id="cs-pills-two-tab" data-toggle="pill" href="#cs-pills-two" role="tab" aria-controls="cs-pills-two" aria-selected="false">Finds the<br>
Best Sales Leads</a>
</li>
<li class="nav-item">
<a class="nav-link" id="cs-pills-three-tab" data-toggle="pill" href="#cs-pills-three" role="tab" aria-controls="cs-pills-three" aria-selected="false">Have Relevant<br>
Conversation</a>
</li>
<li class="nav-item">
<a class="nav-link" id="cs-pills-five-tab" data-toggle="pill" href="#cs-pills-five" role="tab" aria-controls="cs-pills-five" aria-selected="false">Manage Sales<br>
Pipeline Better</a>
</li>
</ul>
<div class="tab-content mt-5" id="pills-tabContent">
<div class="tab-pane fade show active" id="cs-pills-one" role="tabpanel" aria-labelledby="cs-pills-one-tab">
<!-- Tab Content -->
<div class="row">
<div class="col-sm-6 col-md-4">
<div class="material-pills-text">
<h4 class="text-primary">Finds the best Sales leads</h4>
<p>Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc, litot Europa usa li sam vocabular. Li lingues differe solmen in li grammatica, li pronunciation e li plu commun vocabules. Omnicos directe al desirabilite de un nov lingua franca: On refusa continuar.</p>
</div>
</div>
<div class="col-sm-6 col-md-8">
<img src="images/dashboard.png" class="img-fluid" alt="" data-aos="fade-up" data-aos-anchor-placement="top-bottom">
</div>
</div>
<!-- /Tab Content -->
</div>
<div class="tab-pane fade" id="cs-pills-two" role="tabpanel" aria-labelledby="cs-pills-two-tab">
<!-- Tab Content -->
<div class="row">
<div class="col-sm-6">
<img src="images/features-5.png" class="img-fluid" alt="">
</div>
<div class="col-sm-6">
<div class="material-pills-text">
<h4 class="text-primary">Build with Bootstrap 4</h4>
<p>CRM used Bootstrap, the most popular HTML, CSS, and JS framework. Thanks to this developers without experience can modify code without any problems.</p>
<h4 class="text-primary">More UI Components</h4>
<p>They are designed for simple and flexible user interface (UI) rendering. </p>
</div>
</div>
</div>
<!-- /Tab Content -->
</div>
<div class="tab-pane fade" id="cs-pills-three" role="tabpanel" aria-labelledby="cs-pills-three-tab">
<!-- Tab Content -->
<div class="row">
<div class="col-sm-6 col-md-4">
<div class="material-pills-text r-text">
<h4 class="text-primary">Finds the best Sales leads</h4>
<p>Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc, litot Europa usa li sam vocabular. Li lingues differe solmen in li grammatica, li pronunciation e li plu commun vocabules. Omnicos directe al desirabilite de un nov lingua franca: On refusa continuar.</p>
</div>
</div>
<div class="col-sm-6 col-md-8">
<img src="images/mockup.png" class="img-fluid" alt="">
</div>
</div>
<!-- /Tab Content -->
</div>
<div class="tab-pane fade" id="cs-pills-five" role="tabpanel" aria-labelledby="cs-pills-five-tab">
<!-- Tab Content -->
<div class="row">
<div class="col-sm-6 ">
<div class="material-pills-text">
<h4 class="text-primary">Finds the best Sales leads</h4>
<p>
We used CSS3 for most of our components to avoid using unnecessary JavaScript libraries. All this to make it fast, reliable and pleasant to use by everyone!
</p>
</div>
</div>
<div class="col-sm-6 ">
<img src="images/features-2.png" class="img-fluid" alt="">
</div>
</div>
<!-- /Tab Content -->
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Material Pills </End> -->
<!-- Media Call Action <Start> -->
<div class="bg-gray">
<div class="container">
<div class="call-action-media">
<div class="row">
<div class="col-sm-8">
<div class="media">
<div class="media-left"> <img src="images/call-down.svg" alt="img" class="img-fluid" width="90"> </div>
<div class="media-body">
<h3 class="text-primary">Want to try CRM Software for Free?</h3>
<p class="call-action-media-text">Close more deals than ever, automatice lead captures,in-built phone,smart alerts with push notifcations.</p>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="mt-4"><a href="#" class="cbtn btn-grad btn-width btn-round">Register Now</a></div>
</div>
</div>
</div>
</div>
</div>
<!-- Media Call Action </End> -->
<!-- Features -->
<div class="bg-gray py-80" id="features">
<div class="container">
<div class="row">
<div class="col-sm-12">
<div class="section-head text-center">
<h1 class="text-primary">CRM Features</h1>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6 col-lg-4">
<div class="feature-left media mb-5">
<div class="media-icon d-flex mr-3"> <img src="images/icn1.svg" alt="" class="img-fluid"> </div>
<div class="media-body">
<h5 class="mt-0">Easy Customization</h5> Cras sit amet nibh libero, in gravida nulla. Nulla vel
</div>
</div>
</div>
<div class="col-md-6 col-lg-4">
<div class="feature-left media mb-5">
<div class="media-icon d-flex mr-3"> <img src="images/icn2.svg" alt="" class="img-fluid"> </div>
<div class="media-body">
<h5 class="mt-0">Super Fast</h5> Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante.
</div>
</div>
</div>
<div class="col-md-6 col-lg-4">
<div class="feature-left media mb-5">
<div class="media-icon d-flex mr-3"> <img src="images/icn3.svg" alt="" class="img-fluid"> </div>
<div class="media-body">
<h5 class="mt-0">Save Money</h5>in gravida nulla. Nulla vel metus scelerisque ante sollicitudin.
</div>
</div>
</div>
<div class="col-md-6 col-lg-4">
<div class="feature-left media mb-5">
<div class="media-icon d-flex mr-3"> <img src="images/icn4.svg" alt="" class="img-fluid"> </div>
<div class="media-body">
<h5 class="mt-0">Cloud Upload</h5> sit amet nibh libero, in gravida nulla. vel metus scelerisque ante sollicitudin.
</div>
</div>
</div>
<div class="col-md-6 col-lg-4">
<div class="feature-left media mb-5">
<div class="media-icon d-flex mr-3"> <img src="images/icn5.svg" alt="" class="img-fluid"> </div>
<div class="media-body">
<h5 class="mt-0">Proven Technology</h5> Cras sit amet nibh libero, in gravida nulla. Nulla vel metus ante .
</div>
</div>
</div>
<div class="col-md-6 col-lg-4">
<div class="feature-left media mb-5">
<div class="media-icon d-flex mr-3"> <img src="images/icn6.svg" alt="" class="img-fluid"> </div>
<div class="media-body">
<h5 class="mt-0">100% Satisfaction</h5>Amet nibh libero, in gravida nulla. Nulla vel metus ante sollicitudin.
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /Features -->
<!-- Video Block & Testimonials -->
<div class="py-80 bg-gray">
<div class="box-shadow custom-witdth-box">
<div class="floated-box">
<div class="container">
<div class="row">
<div class="col-sm-12 text-center">
<a class="venobox vbox-item video-play" data-autoplay="true" data-vbtype="video" href="https://youtu.be/kubGCSj5y3k">
<img src="images/video-bg.png" alt="" class="img-fluid">
<div class="vid-fixed-icn"><img src="images/video-thumb.png" alt="" class="img-fluid"></div>
</a>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<div class="slider single-item">
<div class="slider-item">
<div class="testimonial-default">
<div class="testimonial-default-img"><img src="images/female-75.jpg" alt="" class="center-block img-fluid"></div>
<h4>“On refusa continuar payar custosi traductores. At solmen va esser necessi far uniform grammatica, pronunciation plu sommun paroles.”</h4>
<h5>Martin Loyola - HR at SofTech</h5>
</div>
</div>
<div class="slider-item">
<div class="testimonial-default">
<div class="testimonial-default-img"><img src="images/male-14.jpg" alt="" class="center-block img-fluid"></div>
<h4>“On refusa continuar payar custosi traductores. At solmen va esser necessi far uniform grammatica, pronunciation plu sommun paroles.”</h4>
<h5>Martin Loyola - HR at SofTech</h5>
</div>
</div>
<div class="slider-item">
<div class="testimonial-default">
<div class="testimonial-default-img"><img src="images/29.jpg" alt="" class="center-block img-fluid"></div>
<h4>“On refusa continuar payar custosi traductores. At solmen va esser necessi far uniform grammatica, pronunciation plu sommun paroles.”</h4>
<h5>Martin Loyola - HR at SofTech</h5>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /Video Block & Testimonials -->
<!-- Price Tables -->
<div class="py-80" id="pricing">
<div class="container">
<div class="row">
<div class="col-sm-12">
<div class="section-head text-center">
<h1 class="text-primary">Best Pricing Plan</h1>
<p>Close more deals than ever, automatice lead captures,in-built phone,smart alerts with push notifcations.</p>
</div>
<ul class="nav nav-pills justify-content-center nav-pills-group" id="pills-tab2" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="pills-home-tab2" data-toggle="pill" href="#pills-home2" role="tab" aria-controls="pills-home2" aria-selected="true">Monthly</a>
</li>
<li class="nav-item">
<a class="nav-link" id="pills-profile-tab2" data-toggle="pill" href="#pills-profile2" role="tab" aria-controls="pills-profile2" aria-selected="false">Yearly</a>
</li>
</ul>
<div class="tab-content" id="pills-tabContent2">
<div class="tab-pane fade show active" id="pills-home2" role="tabpanel" aria-labelledby="pills-home-tab2">
<!-- Tab Content -->
<div class="row">
<div class="col-md-4">
<!-- Price-Box <Start> -->
<div class="cs-price-card mt-5" data-aos="fade-up" data-aos-anchor-placement="top-bottom">
<div class="cs-price-card-info">
<h5>Free</h5>
<h1><sup>$</sup>0.00<small>Month</small></h1>
</div>
<div class="cs-price-card-content">
<ul class="cs-price-card-features">
<li>1 - 5 Users</li>
<li>5 GB Upload Size</li>
<li>Full Customer Support</li>
<li class="in-active">Free Updates</li>
<li class="in-active">Maximum Protection</li>
</ul>
<div><a href="#" class="btn btn-light btn-round btn-sm">Get Started</a></div>
</div>
</div>
<!-- Price-Box </End> -->
</div>
<div class="col-md-4">
<!-- Price-Box <Start> -->
<div class="cs-price-card mt-5" data-aos="fade-up" data-aos-anchor-placement="top-bottom" data-aos-duration="1300">
<div class="cs-price-card-info">
<h5>Premium</h5>
<h1><sup>$</sup>12.00<small>Month</small></h1>
</div>
<div class="cs-price-card-content">
<ul class="cs-price-card-features">
<li>1 - 5 Users</li>
<li>5 GB Upload Size</li>
<li>Full Customer Support</li>
<li>Free Updates</li>
<li class="in-active">Maximum Protection</li>
</ul>
<div><a href="#" class="cbtn btn-grad btn-round btn-sm">Get Started</a></div>
</div>
</div>
<!-- Price-Box </End> -->
</div>
<div class="col-md-4">
<!-- Price-Box <Start> -->
<div class="cs-price-card mt-5" data-aos="fade-up" data-aos-anchor-placement="top-bottom" data-aos-duration="1800">
<div class="cs-price-card-info">
<h5>Advanced</h5>
<h1><sup>$</sup>28.00<small>Month</small></h1>
</div>
<div class="cs-price-card-content">
<ul class="cs-price-card-features">
<li>1 - 5 Users</li>
<li>5 GB Upload Size</li>
<li>Full Customer Support</li>
<li>Free Updates</li>
<li>Maximum Protection</li>
</ul>
<div><a href="#" class="btn btn-light btn-round btn-sm">Get Started</a></div>
</div>
</div>
<!-- Price-Box </End> -->
</div>
</div>
<!-- /Tab Content -->
</div>
<div class="tab-pane fade" id="pills-profile2" role="tabpanel" aria-labelledby="pills-profile-tab2">
<!-- Tab2 Content -->
<div class="row">
<div class="col-md-4">
<!-- Price-Box <Start> -->
<div class="cs-price-card mt-5">
<div class="cs-price-card-info">
<h5>Silver</h5>
<h1><sup>$</sup>40.00<small>Month</small></h1>
</div>
<div class="cs-price-card-content">
<ul class="cs-price-card-features">
<li>1 - 5 Users</li>
<li>5 GB Upload Size</li>
<li>Full Customer Support</li>
<li class="in-active">Free Updates</li>
<li class="in-active">Maximum Protection</li>
</ul>
<div><a href="#" class="btn btn-light btn-round btn-sm">Get Started</a></div>
</div>
</div>
<!-- Price-Box </End> -->
</div>
<div class="col-md-4">
<!-- Price-Box <Start> -->
<div class="cs-price-card mt-5">
<div class="cs-price-card-info btn-grad">
<h5 class="text-white">Diamond</h5>
<h1 class="text-white"><sup>$</sup>212.00<small>Month</small></h1>
</div>
<div class="cs-price-card-content">
<ul class="cs-price-card-features">
<li>1 - 5 Users</li>
<li>5 GB Upload Size</li>
<li>Full Customer Support</li>
<li>Free Updates</li>
<li class="in-active">Maximum Protection</li>
</ul>
<div><a href="#" class="btn btn-primary btn-round btn-sm">Get Started</a></div>
</div>
</div>
<!-- Price-Box </End> -->
</div>
<div class="col-md-4">
<!-- Price-Box <Start> -->
<div class="cs-price-card mt-5">
<div class="cs-price-card-info">
<h5>Gold</h5>
<h1><sup>$</sup>128.00<small>Month</small></h1>
</div>
<div class="cs-price-card-content">
<ul class="cs-price-card-features">
<li>1 - 5 Users</li>
<li>5 GB Upload Size</li>
<li>Full Customer Support</li>
<li>Free Updates</li>
<li>Maximum Protection</li>
</ul>
<div><a href="#" class="btn btn-light btn-round btn-sm">Get Started</a></div>
</div>
</div>
<!-- Price-Box </End> -->
</div>
</div>
<!-- /Tab2 Content -->
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /Price Tables -->
<!-- Blog -->
<div class="bg-gray py-80">
<div class="container">
<div class="row">
<div class="col-sm-12">
<div class="section-head text-center">
<h1 class="text-primary">Our Blog</h1>
<p>Close more deals than ever, automatice lead captures,in-built phone,smart alerts with push notifcations.</p>
</div>
</div>
</div>
<div class="row">
<div class="col-md-4">
<!-- Webnair Card <Start> -->
<div class="card cs-webnair-card" data-aos="fade-up" data-aos-anchor-placement="top-bottom">
<a href="blog-single.html"><img class="card-img-top" src="images/blog-2.jpg" alt="Card image cap"></a>
<div class="card-body">
<a href="blog-single.html">
<h4 class="card-title text-primary">Work Desk Inspirations</h4>
</a>
<p class="card-text">Seamlessly restore wireless ideas before interdependent e-tailers. Conveniently morph emerging quality vectors for progressive catalysts for change utilize fully tested...</p>
<a href="blog-single.html" class="btn btn-primary btn-round">Read More <i class="fa fa-long-arrow-right" ></i></a>
</div>
</div>
<!-- Webnair Card </End> -->
</div>
<div class="col-md-4">
<!-- Webnair Card <Start> -->
<div class="card cs-webnair-card" data-aos="fade-up" data-aos-anchor-placement="top-bottom" data-aos-duration="1300">
<a href="blog-single.html"><img class="card-img-top" src="images/blog-4.jpg" alt="Card image cap"></a>
<div class="card-body">
<a href="blog-single.html">
<h4 class="card-title text-primary">A list of development tools</h4>
</a>
<p class="card-text">Seamlessly restore wireless ideas before interdependent e-tailers. Conveniently morph emerging quality vectors for progressive catalysts for change utilize fully tested...</p>
<a href="blog-single.html" class="btn btn-primary btn-round">Read More <i class="fa fa-long-arrow-right" ></i></a>
</div>
</div>
<!-- Webnair Card </End> -->
</div>
<div class="col-md-4">
<!-- Webnair Card <Start> -->
<div class="card cs-webnair-card" data-aos="fade-up" data-aos-anchor-placement="top-bottom" data-aos-duration="1800">
<a href="blog-single.html"><img class="card-img-top" src="images/blog-3.jpg" alt="Card image cap"></a>
<div class="card-body">
<a href="blog-single.html">
<h4 class="card-title text-primary">Success and Team Work</h4>
</a>
<p class="card-text">Seamlessly restore wireless ideas before interdependent e-tailers. Conveniently morph emerging quality vectors for progressive catalysts for change utilize fully tested...</p>
<a href="blog-single.html" class="btn btn-primary btn-round">Read More <i class="fa fa-long-arrow-right" ></i></a>
</div>
</div>
<!-- Webnair Card </End> -->
</div>
</div>
</div>
</div>
<!-- /Blog -->
<!-- Partners -->
<div class="py-80">
<div class="container">
<div class="row">
<div class="col-sm-12">
<div class="section-head text-center">
<h1 class="text-primary">Trusted by Most Popular Brands</h1>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<ul class="partners-horiz-list clearfix">
<li class="partners-horiz-item"><img src="images/partners/p1.png" class="img-fluid partner-img" alt="partner"></li>
<li class="partners-horiz-item"><img src="images/partners/p2.png" class="img-fluid partner-img" alt="partner"></li>
<li class="partners-horiz-item"><img src="images/partners/p3.png" class="img-fluid partner-img" alt="partner"></li>
<li class="partners-horiz-item"><img src="images/partners/p4.png" class="img-fluid partner-img" alt="partner"></li>
<li class="partners-horiz-item"><img src="images/partners/p5.png" class="img-fluid partner-img" alt="partner"></li>
</ul>
</div>
</div>
</div>
</div>
<!-- /Partners-->
<div class="dots">
<div class="dot one"></div>
<div class="dot two"></div>
<div class="dot three"></div>
<div class="dot four"></div>
<div class="dot five"></div>
<div class="dot six"></div>
<div class="dot seven"></div>
<div class="dot eight"></div>
<div class="dot nine"></div>
<div class="dot ten"></div>
</div>
<!-- Features -->
<div class="bg-gray py-80" id="webinars">
<div class="container">
<div class="row">
<div class="col-sm-12">
<div class="section-head text-center">
<h1 class="text-primary">Upcoming Webinars</h1>
<p>Close more deals than ever, automatice lead captures,in-built phone,smart alerts with push notifcations.</p>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<!-- Webnair Card <Start> -->
<div class="card cs-webnair-card" data-aos="fade-up" data-aos-anchor-placement="top-bottom">
<div class="card-body">
<h4 class="card-title text-primary">Li Europan lingues es membres delsam</h4>
<p class="card-text">Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc, litot Europa.</p>
<div class="media">
<img class="mr-3" src="images/profile1.png" alt="image" width="50" height="50">
<div class="media-body">
<h5><small>By</small> Fuge Hamlinton</h5>
Marketing Manager, TSW
</div>
</div>
</div>
<div class="card-actions">
<div class="row">
<div class="col-sm-6">
<div class="webnair-date">
<h5>Apr</h5>
<h2>18</h2>
<p>10:30AM IST</p>
</div>
</div>
<div class="col-sm-6">
<div class="my-4 text-center">
<a href="#" class="btn btn-primary btn-round">Im Interested <i class="fa fa-long-arrow-right" ></i></a>
</div>
</div>
</div>
</div>
</div>
<!-- Webnair Card </End> -->
</div>
<div class="col-md-6">
<!-- Webnair Card <Start> -->
<div class="card cs-webnair-card" data-aos="fade-up" data-aos-anchor-placement="top-bottom" data-aos-duration="1500">
<div class="card-body">
<h4 class="card-title text-primary">Li Europan lingues es membres delsam</h4>
<p class="card-text">Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie, musica, sport etc, litot Europa.</p>
<div class="media">
<img class="mr-3" src="images/profile1.png" alt="image" width="50" height="50">
<div class="media-body">
<h5><small>By</small> Fuge Hamlinton</h5>
Marketing Manager, TSW
</div>
</div>
</div>
<div class="card-actions">
<div class="row">
<div class="col-sm-6">
<div class="webnair-date">
<h5>Apr</h5>
<h2>18</h2>
<p>10:30AM IST</p>
</div>
</div>
<div class="col-sm-6">
<div class="my-4 text-center">
<a href="#" class="btn btn-primary btn-round">Im Interested <i class="fa fa-long-arrow-right" ></i></a>
</div>
</div>
</div>
</div>
</div>
<!-- Webnair Card </End> -->
</div>
</div>
</div>
</div>
<!-- /Features -->
<!-- Call Action - Primary<Start> -->
<div class="call-action-primary py-80">
<div class="container">
<div class="row">
<div class="col-sm-12">
<div class="call-action-primary-content text-center">
<h1 class="text-white mb-3 call-action-head">Join our CRM for Free?</h1>
<p class="text-white call-action-text">Lor separat existentie es un myth. Por scientie, musica, sport etc, litot Europa usa li sam vocabular. Li lingues differe solmen in li grammatica</p>
<form class="mt-5 ">
<div class="input-group call-action-primary-search">
<input type="text" class="form-control call-action-primary-input" placeholder="Recipient's username" aria-label="Recipient's username" aria-describedby="basic-addon2">
<div class="input-group-append">
<button type="submit" class="call-action-primary-btn ">Get Started</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<!-- Call Action - Primary</End> -->
<!-- Twitter widgets -->
<div class="py-80">
<div class="container">
<div class="row">
<div class="col-sm-12">
<div class="section-head text-center">
<h1 class="text-primary">What our users say</h1>
<p>With CRM, your team can now use AI-based lead scoring.</p>
</div>
</div>
</div>
<div class="row">
<div class="col-md-4">
<div class="embed-tweet-item">
<blockquote class="twitter-tweet" data-cards="hidden" lang="en" data-width="550" data-link-color="#7642FF" data-align="center">
<a href="https://twitter.com/hemeon/status/988494146628448257"></a>
</blockquote>
</div>
</div>
<div class="col-md-4">
<div class="embed-tweet-item">
<blockquote class="twitter-tweet" data-cards="hidden" lang="en" data-width="550" data-link-color="#7642FF" data-align="center">
<a href="https://twitter.com/dcancel/status/965995722129764353"></a>
</blockquote>
</div>
</div>
<div class="col-md-4">
<div class="embed-tweet-item">
<blockquote class="twitter-tweet" data-cards="hidden" lang="en" data-width="550" data-link-color="#7642FF" data-align="center">
<a href="https://twitter.com/csallen/status/984811026544713728"></a>
</blockquote>
</div>
</div>
</div>
</div>
</div>
<!-- /Twitter widgets -->
<!-- Footer -->
<footer>
<div class="container">
<div class="row">
<div class="col-sm-6 col-md-4 col-lg-3">
<h4 class="footer-head">About Product</h4>
<ul class="footer-links">
<li><a href="#" title="Link">Pricing</a></li>
<li><a href="#" title="Link">Terms and Conditions</a></li>
<li><a href="#" title="Link">Privacy Policy</a></li>
<li><a href="#" title="Link">Contact</a></li>
</ul>
</div>
<div class="col-sm-6 col-md-4 col-lg-3">
<h4 class="footer-head">Useful Links</h4>
<ul class="footer-links">
<li><a href="#" title="Link">License</a></li>
<li><a href="#" title="Link">Press Resources</a></li>
<li><a href="#" title="Link">API</a></li>
<li><a href="#" title="Link">Open Source</a></li>
<li><a href="#" title="Link">Download</a></li>
</ul>
</div>
<div class="col-sm-6 col-md-4 col-lg-3">
<h4 class="footer-head">Company</h4>
<ul class="footer-links">
<li><a href="#" title="Link">About us</a></li>
<li><a href="#" title="Link">Careers</a></li>
<li><a href="#" title="Link">Startup Program</a></li>
<li><a href="#" title="Link">Help</a></li>
</ul>
</div>
<div class="col-sm-6 col-md-4 col-lg-3">
<h4 class="footer-head">Contact Us</h4>
<ul class="footer-links">
<li><a href="#" title="Link">ohdearui@gmail.com</a></li>
<li><a href="#" title="Link">www.ohdearui.com</a></li>
</ul>
<h4 class="footer-head">Follow Us</h4>
<ul class="footer-share-it">
<li class="shate-it-item"><a href="#" class="btn btn-share-sm bg-facebook"><i class="fa fa-facebook"></i></a></li>
<li class="shate-it-item"><a href="#" class="btn btn-share-sm bg-twitter"><i class="fa fa-twitter"></i></a></li>
<li class="shate-it-item"><a href="#" class="btn btn-share-sm bg-google"><i class="fa fa-google-plus"></i></a></li>
</ul>
</div>
</div>
<div class="copyright-bar clearfix">
<div class="row">
<div class="col-lg-6">
<h1 class="mt-0 mb-0 text-primary">CRM</h1>
</div>
<div class="col-lg-6">
<div class="copy-text">© 2018 OhDearUI. All Right Recerved.</div>
</div>
</div>
</div>
</div>
</footer>
<!-- Signin Modal -->
<div class="modal cs-modal" id="signin-modal" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered " role="document">
<div class="modal-content custom-modal-content">
<div class=" ">
<div class="row">
<div class="col-lg-12">
<div class="sign-form m-0 p-5">
<div class="show-sm modal-fixed-close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times-circle"></i></div>
<h2 class="sign-form-head text-center">LOGIN</h2>
<form>
<div class="form-group uiIcon">
<input type="text" class="input form-control" placeholder="Email Address" required >
<svg class="svgIcon fill-smoke--d" width="30" height="30" viewBox="0 -6 30 30" enable-background="new 0 -6 30 30">
<path d="M15 11.9c-.9 0-1.7-.2-2.3-.7l-5.7-4.4v8.1c0 .1 0 .3.1.4.1.1.2.2.3.2 2.5.4 5 .5 7.5.5s5-.2 7.5-.5c.1 0 .3-.1.4-.2.2-.1.2-.3.2-.4v-8.1l-5.7 4.4c-.6.5-1.4.7-2.3.7zm-1.3-2.3c.3.3.8.4 1.3.4s1-.1 1.3-.4l6.1-4.7c.3-.3.5-.6.6-1v-.8c0-.1 0-.3-.1-.4-.1-.1-.2-.2-.4-.2-2.5-.3-5-.5-7.5-.5s-5 .2-7.5.5c-.1 0-.2.1-.3.2-.2.1-.2.3-.2.4v.9c.1.3.3.6.6 1l6.1 4.6z"></path>
</svg>
</div>
<div class="form-group uiIcon">
<input type="text" class="input form-control" placeholder="Password" required>
<svg class="svgIcon fill-smoke--d" width="30" height="30" viewBox="0 -6 30 30" enable-background="new 0 -6 30 30">
<path d="M21.6 8.3c-.2-.2-.5-.3-.9-.3h-.7v-2.6c0-1.3-.5-2.4-1.4-3.2-.9-.8-2.1-1.2-3.6-1.2s-2.7.4-3.6 1.2c-.9.8-1.4 1.9-1.4 3.2v2.6h-.7c-.3 0-.7.1-.9.4-.3.2-.4.5-.4.8v6.1c0 .3.1.5.3.7.2.2.4.3.7.4 1.9.4 3.9.6 6 .6 2 0 4-.2 5.9-.6.3-.1.5-.2.7-.4.2-.2.3-.4.3-.7v-6.1c.1-.3 0-.6-.3-.9zm-8.6-2.4c0-1.3.7-1.9 2-1.9s2 .6 2 1.9v2.1h-4v-2.1z"></path>
</svg>
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary btn-block">Login</button>
</div>
</form>
<div class="sign-form-text">
<p><a href="#" class="text-primary"> Create Account</a> <a href="#" class="float-right text-primary">Forgot Password <i class="fa fa-question-circle ml-1"></i></a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /Modal -->
<!-- Signup Modal -->
<div class="modal cs-modal" id="signup-modal" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg modal-full" role="document">
<div class="modal-content custom-modal-content">
<div class=" bg-gray ">
<div class="row">
<div class="col-lg-6 pr-0 h-100 hide-sm">
<div class="">
<div class="sign-left-box">
<h2 class="text-center">CRM</h2>
<p class="text-center">With CRM, your team can now use AI-based lead scoring email, activity capture and more.</p>
<ul class="list-unstyled mt-5">
<li class="media">
<img class="mr-3" src="images/icn-1-white.svg" alt="Generic placeholder image">
<div class="media-body">
<h4 class="text-white">Service Cloud</h4>
<p class="text-white">Sell smarter and faster with the worlds #1 CRM solution.</p>
</div>
</li>
<li class="media my-4">
<img class="mr-3" src="images/icn-2-white.svg" alt="Generic placeholder image">
<div class="media-body">
<h4 class="text-white">Sales Cloud</h4>
<p class="text-white">Support every customer.<br> Anytime. Anywhere.</p>
</div>
</li>
<li class="media">
<img class="mr-3" src="images/icn-3-white.svg" alt="Generic placeholder image">
<div class="media-body">
<h4 class="text-white">Marketing Cloud</h4>
<p class="text-white">The future of marketing is 1-to-1 customer journeys. </p>
</div>
</li>
</ul>
<div class="close-modal cs-fade-in-up" data-dismiss="modal" aria-label="Close">
<svg class="arrow-icon-svg" width="23" height="16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 23 16">
<path fillRule="evenodd" d="M 7.75 0.53C 8.04 0.22 8.53 0.22 8.84 0.53 9.13 0.83 9.3 1.7 9 2 9 2 4 7 4 7 4 7 22 7 22 7 22.43 7 22.35 7.56 22.35 7.99 22.35 8.42 22.43 9 22 9 22 9 4 9 4 9 4 9 9 14 9 14 9.3 14.31 9.13 15.16 8.84 15.46 8.53 15.77 8.04 15.77 7.75 15.46 7.75 15.46 0.89 8.54 0.89 8.54 0.59 8.24 0.59 7.75 0.89 7.45 0.89 7.45 7.75 0.53 7.75 0.53Z" fill="rgb(255,255,255)"/></svg> &nbsp; Back to Home</div>
</div>
</div>
</div>
<div class="col-lg-6 cpl-0 h-100 ">
<div class="sign-form">
<div class="show-sm modal-fixed-close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times-circle"></i></div>
<h4 class="sign-form-head text-center">Signup and Start your Trail</h4>
<form>
<div class="form-group uiIcon">
<input type="text" class="input form-control" placeholder="Full Name" required >
<svg class="svgIcon fill-smoke--d" width="30" height="30" viewBox="0 -6 30 30" enable-background="new 0 -6 30 30">
<path d="M22.9 16.2c.1-.1.1-.3.1-.4-.2-.8-.5-1.4-.9-1.9s-1-1-1.7-1.4c-.2-.1-.6-.3-1.3-.6-.6-.2-1.1-.4-1.4-.6-.3-.2-.6-.4-.7-.7-.1-.4.1-1 .5-1.7 1.5-2.3 1.8-4.3.8-5.9-.3-.6-.7-1.1-1.3-1.5-.6-.3-1.3-.5-2-.5s-1.4.2-2 .5c-.6.4-1.1.8-1.5 1.5-1 1.6-.7 3.6.8 5.9.5.7.7 1.3.5 1.7-.1.2-.2.4-.5.6-.2.2-.5.3-.7.4-.2.1-.5.2-.9.4-.6.3-1.1.4-1.3.6-.7.4-1.3.9-1.7 1.4-.2.4-.5 1-.7 1.8 0 .1 0 .3.1.4l.3.3c1.6.3 4.1.5 7.6.5 2.3 0 4.2-.1 5.8-.3.2 0 .4 0 .6-.1.2 0 .4-.1.5-.1l.3-.1h.30000000000000004c.2 0 .3-.1.4-.2z"></path>
</svg>
</div>
<div class="form-group uiIcon">
<input type="text" class="input form-control" placeholder="Email Address" required>
<svg class="svgIcon fill-smoke--d" width="30" height="30" viewBox="0 -6 30 30" enable-background="new 0 -6 30 30">
<path d="M15 11.9c-.9 0-1.7-.2-2.3-.7l-5.7-4.4v8.1c0 .1 0 .3.1.4.1.1.2.2.3.2 2.5.4 5 .5 7.5.5s5-.2 7.5-.5c.1 0 .3-.1.4-.2.2-.1.2-.3.2-.4v-8.1l-5.7 4.4c-.6.5-1.4.7-2.3.7zm-1.3-2.3c.3.3.8.4 1.3.4s1-.1 1.3-.4l6.1-4.7c.3-.3.5-.6.6-1v-.8c0-.1 0-.3-.1-.4-.1-.1-.2-.2-.4-.2-2.5-.3-5-.5-7.5-.5s-5 .2-7.5.5c-.1 0-.2.1-.3.2-.2.1-.2.3-.2.4v.9c.1.3.3.6.6 1l6.1 4.6z"></path>
</svg>
</div>
<div class="form-group uiIcon">
<input type="text" class="input form-control" placeholder="Company Name" required>
<svg class="svgIcon fill-smoke--d" width="30" height="30" viewBox="0 0 30 30">
<path d="M17,20v4h6q0-9-.46-13.55A15.6,15.6,0,0,0,22,7.29a1.1,1.1,0,0,0-1-.8A36.33,36.33,0,0,0,15,6a36.43,36.43,0,0,0-6,.48,1.15,1.15,0,0,0-1.07.84,15.29,15.29,0,0,0-.49,3.11Q7,15.15,7,24h6V20ZM19,9v3H16V9Zm0,5v3H16V14ZM14,9v3H11V9Zm0,5v3H11V14Z"></path>
</svg>
</div>
<div class="form-group uiIcon">
<input type="text" class="input form-control" placeholder="Password" required>
<svg class="svgIcon fill-smoke--d" width="30" height="30" viewBox="0 -6 30 30" enable-background="new 0 -6 30 30">
<path d="M21.6 8.3c-.2-.2-.5-.3-.9-.3h-.7v-2.6c0-1.3-.5-2.4-1.4-3.2-.9-.8-2.1-1.2-3.6-1.2s-2.7.4-3.6 1.2c-.9.8-1.4 1.9-1.4 3.2v2.6h-.7c-.3 0-.7.1-.9.4-.3.2-.4.5-.4.8v6.1c0 .3.1.5.3.7.2.2.4.3.7.4 1.9.4 3.9.6 6 .6 2 0 4-.2 5.9-.6.3-.1.5-.2.7-.4.2-.2.3-.4.3-.7v-6.1c.1-.3 0-.6-.3-.9zm-8.6-2.4c0-1.3.7-1.9 2-1.9s2 .6 2 1.9v2.1h-4v-2.1z"></path>
</svg>
</div>
<div class="form-group ">
<div class="input-group mb-3 uiIcon">
<input type="text" class="input form-control" placeholder="CRM Name" aria-label="Recipient's username" aria-describedby="basic-addon2">
<svg class="svgIcon fill-smoke--d" xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 30 30"><path d="M7 15c0-4.4 3.6-8 8-8s8 3.6 8 8-3.6 8-8 8-8-3.6-8-8zm4.3 1.1h-2.4c.3 2.1 1.6 3.8 3.5 4.6-.6-1.2-1-3-1.1-4.6zm0-2.2c.1-1.6.5-3.3 1-4.5-1.8.9-3.1 2.4-3.5 4.5h2.5zm5.6 2.2h-3.9c.2 3.2 1.6 5.2 1.9 5.2.5 0 1.8-2 2-5.2zm-1.9-7.5c-.3 0-1.7 1.6-1.9 5.3h3.8c-.2-3.7-1.5-5.3-1.9-5.3zm2.7.8c.6 1.2.9 2.9 1 4.5h2.4c-.3-2.1-1.6-3.7-3.4-4.5zm3.4 6.7h-2.4c-.1 1.6-.5 3.4-1 4.6 1.8-.9 3.1-2.5 3.4-4.6z"></path></svg>
<div class="input-group-append">
<span class="input-group-text" id="basic-addon2">.crm.com</span>
</div>
</div>
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary btn-block">Signup for Free</button>
</div>
</form>
<div class="sign-form-text">
By signing up, you agree to our <a href="#">T&C</a> and <a href="#">Privacy Policy</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /Modal -->
<!-- Back to Top -->
<a href="#0" class="cd-top js-cd-top"><i class="fa fa-angle-up"></i></a>
<!-- Back to Top ends-->
<script src="js/jquery-2.2.4.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/pace.min.js"></script>
<!-- Plugins -->
<script src="js/back-to-top.js"></script>
<!-- Venobox Lightbox slider -->
<script src="js/venobox.min.js"></script>
<!-- Slick Slider -->
<script src="js/slick/slick.min.js"></script>
<!-- AOS Animate -->
<script src="https://cdn.rawgit.com/michalsnik/aos/2.1.1/dist/aos.js"></script>
<!-- Custom JS -->
<script src="js/main.js"></script>
</body>
</html>