513 lines
22 KiB
HTML
513 lines
22 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<title>Business Template</title>
|
||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
||
<!-- Styles -->
|
||
<link href="css/bootstrap.min.css" rel="stylesheet">
|
||
<link href="css/bootstrap-responsive.min.css" rel="stylesheet">
|
||
<link href="css/bootstrap-overrides.css" rel="stylesheet">
|
||
<link rel="stylesheet" type="text/css" href="css/theme.css">
|
||
<link href='http://fonts.googleapis.com/css?family=Lato:300,400,700,900,300italic,400italic,700italic,900italic' rel='stylesheet' type='text/css'>
|
||
|
||
<link rel="stylesheet" type="text/css" href="css/lib/animate.css" media="screen, projection">
|
||
<link rel="stylesheet" href="css/pricing.css" type="text/css" media="screen" />
|
||
|
||
<!--[if lt IE 9]>
|
||
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
|
||
<![endif]-->
|
||
</head>
|
||
<body>
|
||
<div class="navbar navbar-inverse navbar-static-top">
|
||
<div class="navbar-inner">
|
||
<div class="container">
|
||
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
|
||
<span class="icon-bar"></span>
|
||
<span class="icon-bar"></span>
|
||
<span class="icon-bar"></span>
|
||
</a>
|
||
<a class="brand" href="index.html">
|
||
<strong>CLEAN CANVAS</strong>
|
||
</a>
|
||
<div class="nav-collapse collapse">
|
||
<ul class="nav pull-right">
|
||
<li><a href="index.html">HOME</a></li>
|
||
<li><a href="about-us.html">ABOUT US</a></li>
|
||
<li class="dropdown">
|
||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
|
||
PAGES
|
||
<b class="caret"></b>
|
||
</a>
|
||
<ul class="dropdown-menu">
|
||
<li><a href="features.html">Features</a></li>
|
||
<li><a href="services.html">Services</a></li>
|
||
<li><a href="portfolio.html">Portfolio</a></li>
|
||
<li><a href="portfolio-item.html">Portfolio Item</a></li>
|
||
<li><a href="coming-soon.html">Coming Soon</a></li>
|
||
<li><a href="sign-in.html">Sign in</a></li>
|
||
<li><a href="sign-up.html">Sign up</a></li>
|
||
<li><a href="backgrounds.html">Backgrounds</a></li>
|
||
</ul>
|
||
</li>
|
||
<li><a href="pricing.html" class="active">PRICING</a></li>
|
||
<li><a href="contact.html">CONTACT US</a></li>
|
||
<li><a href="blog.html">BLOG</a></li>
|
||
<li><a class="btn-header" href="sign-up.html">Sign up</a></li>
|
||
<li><a class="btn-header" href="sign-in.html">Sign in</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Pricing Option 1 -->
|
||
<div id="in_pricing">
|
||
<div class="container">
|
||
<div class="head">
|
||
<h3>Clean Canvas is free for 14 days</h3>
|
||
<h6>After your trial ends, pick a plan that best fits your needs:</h6>
|
||
</div>
|
||
|
||
<div class="row charts_wrapp">
|
||
<!-- Plan Box -->
|
||
<div class="span4">
|
||
<div class="plan">
|
||
<div class="wrapper">
|
||
<h3>Lite</h3>
|
||
<div class="price">
|
||
<span class="dollar">$</span>
|
||
<span class="qty">35</span>
|
||
<span class="month">/month</span>
|
||
</div>
|
||
<div class="features">
|
||
<p>
|
||
<strong>10</strong>
|
||
Shared Projects
|
||
</p>
|
||
<p>
|
||
<strong>4</strong>
|
||
Team Members
|
||
</p>
|
||
<p>
|
||
<strong>10</strong>
|
||
Storage
|
||
</p>
|
||
</div>
|
||
<a class="order" href="#">ORDER NOW</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Plan Box -->
|
||
<div class="span4 pro">
|
||
<div class="plan">
|
||
<div class="wrapper">
|
||
<img class="ribbon" src="img/badge.png">
|
||
<h3>Pro</h3>
|
||
<div class="price">
|
||
<span class="dollar">$</span>
|
||
<span class="qty">99</span>
|
||
<span class="month">/month</span>
|
||
</div>
|
||
<div class="features">
|
||
<p>
|
||
<strong>10</strong>
|
||
Shared Projects
|
||
</p>
|
||
<p>
|
||
<strong>25</strong>
|
||
Team Members
|
||
</p>
|
||
<p>
|
||
<strong>Unlimited</strong>
|
||
Storage
|
||
</p>
|
||
<p>
|
||
<strong>Plus </strong>
|
||
Phone Support
|
||
</p>
|
||
</div>
|
||
<a class="order" href="#">ORDER NOW</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Plan Box -->
|
||
<div class="span4 standar">
|
||
<div class="plan">
|
||
<div class="wrapper">
|
||
<h3>Standard</h3>
|
||
<div class="price">
|
||
<span class="dollar">$</span>
|
||
<span class="qty">65</span>
|
||
<span class="month">/month</span>
|
||
</div>
|
||
<div class="features">
|
||
<p>
|
||
<strong>10</strong>
|
||
Shared Projects
|
||
</p>
|
||
<p>
|
||
<strong>4</strong>
|
||
Team Members
|
||
</p>
|
||
<p>
|
||
<strong>10</strong>
|
||
Storage
|
||
</p>
|
||
</div>
|
||
<a class="order" href="#">ORDER NOW</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="start">
|
||
<p>Start your free, no-risk, 14 day trial! </p>
|
||
<a href="#">Start Now!</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- FAQs -->
|
||
<div id="faq">
|
||
<div class="container">
|
||
<div class="section_header">
|
||
<h3>Frequently asked questions</h3>
|
||
</div>
|
||
|
||
<div class="row">
|
||
<div class="span6 block">
|
||
<div class="box">
|
||
<p class="title">How long are your contracts?</p>
|
||
<p class="answ">
|
||
There are many variations of passages of Lorem Ipsum available, but the randomised words which don’t look even slightly believable. If you are anything embarrassing hidden in the middle of text.</p>
|
||
</div>
|
||
<div class="box">
|
||
<p class="title">How do i sign up?</p>
|
||
<p class="answ">
|
||
There are many variations of passages of Lorem Ipsum available, but the randomised words which don’t look even slightly believable. If you are anything embarrassing hidden in the middle of text.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="span6 block">
|
||
<div class="box">
|
||
<p class="title">What is meant by unlimited?</p>
|
||
<p class="answ">
|
||
There are many variations of passages of Lorem Ipsum available, but the randomised words which don’t look even slightly believable. If you are anything embarrassing hidden in the middle of text.</p>
|
||
</div>
|
||
<div class="box">
|
||
<p class="title">Is there a discount for yearly service?</p>
|
||
<p class="answ">
|
||
There are many variations of passages of Lorem Ipsum available, but the randomised words which don’t look even slightly believable. If you are anything embarrassing hidden in the middle of text.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Pricing Option 2 -->
|
||
<div id="in_pricing2">
|
||
<div class="container">
|
||
<div class="section_header">
|
||
<h3>Pricing <span>(option 2)</span></h3>
|
||
</div>
|
||
|
||
<div class="row charts_wrapp">
|
||
<!-- Plan Box -->
|
||
<div class="span3">
|
||
<div class="plan">
|
||
<div class="wrapper">
|
||
<h3>Lite</h3>
|
||
<div class="price">
|
||
<span class="dollar">$</span>
|
||
<span class="qty">35</span>
|
||
<span class="month">/month</span>
|
||
</div>
|
||
<div class="features">
|
||
<p>
|
||
<strong>10</strong>
|
||
Shared Projects
|
||
</p>
|
||
<p>
|
||
<strong>4</strong>
|
||
Team Members
|
||
</p>
|
||
<p>
|
||
<strong>10</strong>
|
||
Storage
|
||
</p>
|
||
</div>
|
||
<a class="order" href="#">ORDER NOW</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Plan Box -->
|
||
<div class="span3 ultra">
|
||
<div class="plan">
|
||
<div class="wrapper">
|
||
<img class="ribbon" src="img/badge.png">
|
||
<h3>Ultra</h3>
|
||
<div class="price">
|
||
<span class="dollar">$</span>
|
||
<span class="qty">99</span>
|
||
<span class="month">/month</span>
|
||
</div>
|
||
<div class="features">
|
||
<p>
|
||
<strong>10</strong>
|
||
Shared Projects
|
||
</p>
|
||
<p>
|
||
<strong>25</strong>
|
||
Team Members
|
||
</p>
|
||
<p>
|
||
<strong>Unlimited</strong>
|
||
Storage
|
||
</p>
|
||
<p>
|
||
<strong>Plus </strong>
|
||
Phone Support
|
||
</p>
|
||
</div>
|
||
<a class="order" href="#">ORDER NOW</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Plan Box -->
|
||
<div class="span3">
|
||
<div class="plan">
|
||
<div class="wrapper">
|
||
<h3>Standard</h3>
|
||
<div class="price">
|
||
<span class="dollar">$</span>
|
||
<span class="qty">65</span>
|
||
<span class="month">/month</span>
|
||
</div>
|
||
<div class="features">
|
||
<p>
|
||
<strong>10</strong>
|
||
Shared Projects
|
||
</p>
|
||
<p>
|
||
<strong>4</strong>
|
||
Team Members
|
||
</p>
|
||
<p>
|
||
<strong>10</strong>
|
||
Storage
|
||
</p>
|
||
</div>
|
||
<a class="order" href="#">ORDER NOW</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Plan Box -->
|
||
<div class="span3 black">
|
||
<div class="plan">
|
||
<div class="wrapper">
|
||
<h3>Need more?</h3>
|
||
<h6>Let’s talk.</h6>
|
||
<p>If your company needs are larger than any of our plans, let’s talk.</p>
|
||
<a class="order" href="#">GET IN TOUCH</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Pricing Option3 -->
|
||
<div id="in_pricing2">
|
||
<div class="container">
|
||
<div class="section_header">
|
||
<h3>Pricing <span>(option 3)</span></h3>
|
||
</div>
|
||
|
||
<div class="row charts_wrapp">
|
||
<!-- Plan Box -->
|
||
<div class="span3">
|
||
<div class="plan">
|
||
<div class="wrapper">
|
||
<h3>Lite</h3>
|
||
<div class="price">
|
||
<span class="dollar">$</span>
|
||
<span class="qty">35</span>
|
||
<span class="month">/month</span>
|
||
</div>
|
||
<div class="features">
|
||
<p>
|
||
<strong>10</strong>
|
||
Shared Projects
|
||
</p>
|
||
<p>
|
||
<strong>4</strong>
|
||
Team Members
|
||
</p>
|
||
<p>
|
||
<strong>10</strong>
|
||
Storage
|
||
</p>
|
||
</div>
|
||
<a class="order" href="#">ORDER NOW</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Plan Box -->
|
||
<div class="span3">
|
||
<div class="plan">
|
||
<div class="wrapper">
|
||
<h3>Standard</h3>
|
||
<div class="price">
|
||
<span class="dollar">$</span>
|
||
<span class="qty">65</span>
|
||
<span class="month">/month</span>
|
||
</div>
|
||
<div class="features">
|
||
<p>
|
||
<strong>10</strong>
|
||
Shared Projects
|
||
</p>
|
||
<p>
|
||
<strong>4</strong>
|
||
Team Members
|
||
</p>
|
||
<p>
|
||
<strong>10</strong>
|
||
Storage
|
||
</p>
|
||
</div>
|
||
<a class="order" href="#">ORDER NOW</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Plan Box -->
|
||
<div class="span3 ultra">
|
||
<div class="plan">
|
||
<div class="wrapper">
|
||
<img class="ribbon" src="img/badge.png">
|
||
<h3>Ultra</h3>
|
||
<div class="price">
|
||
<span class="dollar">$</span>
|
||
<span class="qty">99</span>
|
||
<span class="month">/month</span>
|
||
</div>
|
||
<div class="features">
|
||
<p>
|
||
<strong>10</strong>
|
||
Shared Projects
|
||
</p>
|
||
<p>
|
||
<strong>25</strong>
|
||
Team Members
|
||
</p>
|
||
<p>
|
||
<strong>Unlimited</strong>
|
||
Storage
|
||
</p>
|
||
<p>
|
||
<strong>Plus </strong>
|
||
Phone Support
|
||
</p>
|
||
</div>
|
||
<a class="order" href="#">ORDER NOW</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Plan Box -->
|
||
<div class="span3">
|
||
<div class="plan">
|
||
<div class="wrapper">
|
||
<h3>Pro</h3>
|
||
<div class="price">
|
||
<span class="dollar">$</span>
|
||
<span class="qty">80</span>
|
||
<span class="month">/month</span>
|
||
</div>
|
||
<div class="features">
|
||
<p>
|
||
<strong>10</strong>
|
||
Shared Projects
|
||
</p>
|
||
<p>
|
||
<strong>4</strong>
|
||
Team Members
|
||
</p>
|
||
<p>
|
||
<strong>10</strong>
|
||
Storage
|
||
</p>
|
||
</div>
|
||
<a class="order" href="#">ORDER NOW</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<!-- starts footer -->
|
||
<footer id="footer">
|
||
<div class="container">
|
||
<div class="row info">
|
||
<div class="span6 residence">
|
||
<ul>
|
||
<li>2301 East Lamar Blvd. Suite 140. City, Arlington.</li>
|
||
<li>United States, Zip Code TX 76006.</li>
|
||
</ul>
|
||
</div>
|
||
<div class="span5 touch">
|
||
<ul>
|
||
<li><strong>P.</strong> 1 817 274 2933</li>
|
||
<li><strong>E.</strong><a href="#"> bootstrap@twitter.com</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="row credits">
|
||
<div class="span12">
|
||
<div class="row social">
|
||
<div class="span12">
|
||
<a href="#" class="facebook">
|
||
<span class="socialicons ico1"></span>
|
||
<span class="socialicons_h ico1h"></span>
|
||
</a>
|
||
<a href="#" class="twitter">
|
||
<span class="socialicons ico2"></span>
|
||
<span class="socialicons_h ico2h"></span>
|
||
</a>
|
||
<a href="#" class="gplus">
|
||
<span class="socialicons ico3"></span>
|
||
<span class="socialicons_h ico3h"></span>
|
||
</a>
|
||
<a href="#" class="flickr">
|
||
<span class="socialicons ico4"></span>
|
||
<span class="socialicons_h ico4h"></span>
|
||
</a>
|
||
<a href="#" class="pinterest">
|
||
<span class="socialicons ico5"></span>
|
||
<span class="socialicons_h ico5h"></span>
|
||
</a>
|
||
<a href="#" class="dribble">
|
||
<span class="socialicons ico6"></span>
|
||
<span class="socialicons_h ico6h"></span>
|
||
</a>
|
||
<a href="#" class="behance">
|
||
<span class="socialicons ico7"></span>
|
||
<span class="socialicons_h ico7h"></span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="row copyright">
|
||
<div class="span12">
|
||
© 2013 Clean Canvas. All rights reserved. Theme by Detail Canvas.
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
|
||
<script src="http://code.jquery.com/jquery-latest.js"></script>
|
||
<script src="js/bootstrap.min.js"></script>
|
||
<script src="js/theme.js"></script>
|
||
</body>
|
||
</html> |