4872 lines
244 KiB
HTML
4872 lines
244 KiB
HTML
<!--
|
||
=========================================================
|
||
* Blk• Design System Pro - v1.0.0
|
||
=========================================================
|
||
|
||
* Product Page: https://www.creative-tim.com/product/blk-design-system-pro
|
||
* Copyright 2019 Creative Tim (http://www.creative-tim.com)
|
||
|
||
* Coded by www.creative-tim.com
|
||
|
||
=========================================================
|
||
|
||
* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||
-->
|
||
<!DOCTYPE html>
|
||
<html lang="en">
|
||
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||
<link rel="apple-touch-icon" sizes="76x76" href="../../static/blk-pro/assets/img/apple-icon.png">
|
||
<link rel="icon" type="image/png" href="../../static/blk-pro/assets/img/favicon.png">
|
||
<title>
|
||
Blk• Design System Pro by Creative Tim
|
||
</title>
|
||
<!-- Fonts and icons -->
|
||
<link href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,600,700,800" rel="stylesheet" />
|
||
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">
|
||
<!-- Nucleo Icons -->
|
||
<link href="../../static/blk-pro/assets/css/nucleo-icons.css" rel="stylesheet" />
|
||
<!-- CSS Files -->
|
||
<link href="../../static/blk-pro/assets/css/blk-design-system-pro.css?v=1.0.0" rel="stylesheet" />
|
||
<!-- CSS Just for demo purpose, don't include it in your project -->
|
||
<link href="../../static/blk-pro/assets/demo/demo.css" rel="stylesheet" />
|
||
</head>
|
||
|
||
<body class="sections-page">
|
||
<!-- Navbar -->
|
||
<nav class="navbar navbar-expand-lg fixed-top nav-down" color-on-scroll="300">
|
||
<div class="container">
|
||
<div class="navbar-translate">
|
||
<a class="navbar-brand" href="https://demos.creative-tim.com/blk-design-system-pro/index.html" rel="tooltip" title="Designed and Coded by Creative Tim" data-placement="bottom" target="_blank">
|
||
<span>BLK•</span> Design System PRO
|
||
</a>
|
||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navigation" aria-controls="navigation-index" aria-expanded="false" aria-label="Toggle navigation">
|
||
<span class="navbar-toggler-bar bar1"></span>
|
||
<span class="navbar-toggler-bar bar2"></span>
|
||
<span class="navbar-toggler-bar bar3"></span>
|
||
</button>
|
||
</div>
|
||
<div class="collapse navbar-collapse" id="navigation">
|
||
<div class="navbar-collapse-header">
|
||
<div class="row">
|
||
<div class="col-6 collapse-brand">
|
||
<a>
|
||
BLK•
|
||
<span> PRO </span>
|
||
</a>
|
||
</div>
|
||
<div class="col-6 collapse-close text-right">
|
||
<button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#navigation" aria-controls="navigation-index" aria-expanded="false" aria-label="Toggle navigation">
|
||
<i class="tim-icons icon-simple-remove"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<ul class="navbar-nav ml-auto">
|
||
<li class="dropdown nav-item">
|
||
<a href="#" class="dropdown-toggle nav-link" data-toggle="dropdown">
|
||
<i class="fa fa-cogs d-lg-none d-xl-none"></i> Getting started
|
||
</a>
|
||
<div class="dropdown-menu dropdown-with-icons">
|
||
<a href="./index.html" class="dropdown-item">
|
||
<i class="tim-icons icon-paper"></i> Components
|
||
</a>
|
||
<a href="./presentation.html" class="dropdown-item">
|
||
<i class="tim-icons icon-bullet-list-67"></i>Presentation Page
|
||
</a>
|
||
<a href="https://demos.creative-tim.com/blk-design-system-pro/docs/1.0/getting-started/overview.html" class="dropdown-item">
|
||
<i class="tim-icons icon-book-bookmark"></i>Documentation
|
||
</a>
|
||
</div>
|
||
</li>
|
||
<li class="nav-item dropdown">
|
||
<a href="#" class="nav-link dropdown-toggle" id="navbarDropdownMenuLink" data-toggle="dropdown">
|
||
<i class="tim-icons icon-paper" aria-hidden="true"></i>
|
||
<p>Sections</p>
|
||
</a>
|
||
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownMenuLink">
|
||
<a class="dropdown-item" href="./sections.html#headers">
|
||
<i class="tim-icons icon-app"></i> Headers
|
||
</a>
|
||
<a class="dropdown-item" href="./sections.html#features">
|
||
<i class="tim-icons icon-settings"></i> Features
|
||
</a>
|
||
<a class="dropdown-item" href="./sections.html#blogs">
|
||
<i class="tim-icons icon-align-left-2"></i> Blogs
|
||
</a>
|
||
<a class="dropdown-item" href="./sections.html#teams">
|
||
<i class="tim-icons icon-user-run"></i> Teams
|
||
</a>
|
||
<a class="dropdown-item" href="./sections.html#projects">
|
||
<i class="tim-icons icon-paper"></i> Projects
|
||
</a>
|
||
<a class="dropdown-item" href="./sections.html#pricing">
|
||
<i class="tim-icons icon-money-coins"></i> Pricing
|
||
</a>
|
||
<a class="dropdown-item" href="./sections.html#testimonials">
|
||
<i class="tim-icons icon-chat-33"></i> Testimonials
|
||
</a>
|
||
<a class="dropdown-item" href="./sections.html#contactus">
|
||
<i class="tim-icons icon-mobile"></i> Contact Us
|
||
</a>
|
||
<a class="dropdown-item" href="./sections.html#tables">
|
||
<i class="tim-icons icon-chart-bar-32"></i> Tables
|
||
</a>
|
||
<a class="dropdown-item" href="./sections.html#accordion">
|
||
<i class="tim-icons icon-paper"></i> Accordion
|
||
</a>
|
||
</div>
|
||
</li>
|
||
<li class="nav-item dropdown">
|
||
<a href="#" class="nav-link dropdown-toggle" id="navbarDropdownMenuLink" data-toggle="dropdown">
|
||
<i class="tim-icons icon-book-bookmark" aria-hidden="true"></i>
|
||
<p>Examples</p>
|
||
</a>
|
||
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownMenuLink">
|
||
<a class="dropdown-item" href="./examples/about-us.html">
|
||
<i class="tim-icons icon-bulb-63"></i> About-us
|
||
</a>
|
||
<a class="dropdown-item" href="./examples/blog-post.html">
|
||
<i class="tim-icons icon-align-center"></i> Blog Post
|
||
</a>
|
||
<a class="dropdown-item" href="./examples/blog-posts.html">
|
||
<i class="tim-icons icon-chart-bar-32"></i> Blog Posts
|
||
</a>
|
||
<a class="dropdown-item" href="./examples/contact-us.html">
|
||
<i class="tim-icons icon-square-pin"></i> Contact Us
|
||
</a>
|
||
<a class="dropdown-item" href="./examples/landing-page.html">
|
||
<i class="tim-icons icon-paper"></i> Landing Page
|
||
</a>
|
||
<a class="dropdown-item" href="./examples/pricing.html">
|
||
<i class="tim-icons icon-coins"></i> Pricing
|
||
</a>
|
||
<a class="dropdown-item" href="./examples/ecommerce.html">
|
||
<i class="tim-icons icon-basket-simple"></i> Ecommerce Page
|
||
</a>
|
||
<a class="dropdown-item" href="./examples/product-page.html">
|
||
<i class="tim-icons icon-bag-16"></i> Product Page
|
||
</a>
|
||
<a class="dropdown-item" href="./examples/profile-page.html">
|
||
<i class="tim-icons icon-lock-circle"></i> Profile Page
|
||
</a>
|
||
<a class="dropdown-item" href="./examples/error.html">
|
||
<i class="tim-icons icon-button-power"></i> 404 Error Page
|
||
</a>
|
||
<a class="dropdown-item" href="./examples/500-error.html">
|
||
<i class="tim-icons icon-alert-circle-exc"></i> 500 Error Page
|
||
</a>
|
||
<a href="#" class="dropdown-item dropdown-toggle" id="navbarDropdown2" data-toggle="dropdown">
|
||
<i class="tim-icons icon-book-bookmark" aria-hidden="true"></i> App Pages
|
||
</a>
|
||
<div class="dropdown-menu" aria-labelledby="navbarDropdown2">
|
||
<a class="dropdown-item" href="./examples/account-settings.html">
|
||
<i class="tim-icons icon-lock-circle"></i> Account Settings
|
||
</a>
|
||
<a class="dropdown-item" href="./examples/login-page.html">
|
||
<i class="tim-icons icon-tablet-2"></i> Login Page
|
||
</a>
|
||
<a class="dropdown-item" href="./examples/register-page.html">
|
||
<i class="tim-icons icon-laptop"></i> Register Page
|
||
</a>
|
||
<a class="dropdown-item" href="./examples/reset-page.html">
|
||
<i class="tim-icons icon-molecule-40"></i> Reset Page
|
||
</a>
|
||
<a class="dropdown-item" href="./examples/invoice-page.html">
|
||
<i class="tim-icons icon-notes"></i> Invoice Page
|
||
</a>
|
||
<a class="dropdown-item" href="./examples/checkout-page.html">
|
||
<i class="tim-icons icon-basket-simple"></i> Checkout Page
|
||
</a>
|
||
<a class="dropdown-item" href="./examples/chat-page.html">
|
||
<i class="tim-icons icon-email-85"></i> Chat Page
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link btn btn-sm btn-default" href="https://www.creative-tim.com/product/blk-design-system-pro" target="_blank">
|
||
<p>Buy Now</p>
|
||
</a>
|
||
</li>
|
||
<!-- <li class="nav-item">
|
||
<a class="nav-link" rel="tooltip" title="Follow us on Twitter" data-placement="bottom" href="https://twitter.com/CreativeTim" target="_blank">
|
||
<i class="fab fa-twitter"></i>
|
||
<p class="hidden-lg-up">Twitter</p>
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" rel="tooltip" title="Like us on Facebook" data-placement="bottom" href="https://www.facebook.com/CreativeTim" target="_blank">
|
||
<i class="fab fa-facebook-square"></i>
|
||
<p class="hidden-lg-up">Facebook</p>
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" rel="tooltip" title="Follow us on Instagram" data-placement="bottom" href="https://www.instagram.com/CreativeTimOfficial" target="_blank">
|
||
<i class="fab fa-instagram"></i>
|
||
<p class="hidden-lg-up">Instagram</p>
|
||
</a>
|
||
</li> -->
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
<!-- End Navbar -->
|
||
<div class="wrapper">
|
||
<div class="section-space"></div>
|
||
<div class="cd-section" id="headers">
|
||
<!-- ********* HEADER 1 ********* -->
|
||
<div class="header header-1">
|
||
<nav class="navbar navbar-expand-lg bg-primary navbar-absolute">
|
||
<div class="container">
|
||
<div class="navbar-translate">
|
||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#example-header-1" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||
<span class="navbar-toggler-bar bar1"></span>
|
||
<span class="navbar-toggler-bar bar2"></span>
|
||
<span class="navbar-toggler-bar bar3"></span>
|
||
</button>
|
||
<a class="navbar-brand" href="javascript:;">Creative Tim</a>
|
||
</div>
|
||
<div class="collapse navbar-collapse" id="example-header-1">
|
||
<div class="navbar-collapse-header">
|
||
<div class="row">
|
||
<div class="col-6 collapse-brand">
|
||
<a>
|
||
BLK•
|
||
<span> PRO </span>
|
||
</a>
|
||
</div>
|
||
<div class="col-6 collapse-close text-right">
|
||
<button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#example-header-1" aria-controls="navigation-index" aria-expanded="false" aria-label="Toggle navigation">
|
||
<i class="tim-icons icon-simple-remove"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<ul class="navbar-nav mx-auto">
|
||
<li class="nav-item active">
|
||
<a class="nav-link" href="javascript:;">
|
||
Home
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="javascript:;">
|
||
About Us
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="javascript:;">
|
||
Contact Us
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
<ul class="nav navbar-nav">
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="https://twitter.com/CreativeTim">
|
||
<i class="fab fa-twitter"></i>
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="https://www.facebook.com/CreativeTim">
|
||
<i class="fab fa-facebook-square"></i>
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="https://www.instagram.com/CreativeTimOfficial">
|
||
<i class="fab fa-instagram"></i>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
<div class="page-header header-filter">
|
||
<div class="page-header-image" style="background-image: url('../../static/blk-pro/assets/img/andre-benz.jpg');"></div>
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-lg-5 col-md-7 mr-auto text-left mt-5">
|
||
<h6 class="category">BLK Design System</h6>
|
||
<h1 class="title">You can build awesome project with this Design System!</h1>
|
||
<br />
|
||
<div class="buttons">
|
||
<a href="javascript:;" class="btn btn-primary btn-round btn-lg mr-3 pulse">
|
||
<i class="tim-icons icon-delivery-fast"></i>
|
||
</a>
|
||
<p>Watch now!</p>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-7 col-md-12 ml-auto mt-5">
|
||
<div class="iframe-container">
|
||
<img src="https://s3.amazonaws.com/creativetim_bucket/github/gif/black-dashboard.gif" alt="gif">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END HEADER 1 ********* -->
|
||
<!-- ********* HEADER 2 ********* -->
|
||
<div class=" header header-2">
|
||
<nav class="navbar navbar-expand-lg bg-white navbar-absolute">
|
||
<div class="container">
|
||
<div class="navbar-translate">
|
||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#example-header-2" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||
<span class="navbar-toggler-bar bar1"></span>
|
||
<span class="navbar-toggler-bar bar2"></span>
|
||
<span class="navbar-toggler-bar bar3"></span>
|
||
</button>
|
||
<a class="navbar-brand" href="javascript:;">Creative Tim</a>
|
||
</div>
|
||
<div class="collapse navbar-collapse" id="example-header-2">
|
||
<div class="navbar-collapse-header">
|
||
<div class="row">
|
||
<div class="col-6 collapse-brand">
|
||
<a>
|
||
BLK•
|
||
<span> PRO </span>
|
||
</a>
|
||
</div>
|
||
<div class="col-6 collapse-close text-right">
|
||
<button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#example-header-2" aria-controls="navigation-index" aria-expanded="false" aria-label="Toggle navigation">
|
||
<i class="tim-icons icon-simple-remove"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<ul class="navbar-nav mx-auto">
|
||
<li class="nav-item active">
|
||
<a class="nav-link" href="javascript:;">
|
||
Home
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="javascript:;">
|
||
About Us
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="javascript:;">
|
||
Products
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="javascript:;">
|
||
Contact Us
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
<ul class="nav navbar-nav navbar-right">
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="https://twitter.com/CreativeTim">
|
||
<i class="fab fa-twitter"></i>
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="https://www.facebook.com/CreativeTim">
|
||
<i class="fab fa-facebook-square"></i>
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="https://www.instagram.com/CreativeTimOfficial">
|
||
<i class="fab fa-instagram"></i>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
<div class="page-header header-filter">
|
||
<div class="page-header-image" style="background-image: url('../../static/blk-pro/assets/img/matt-palmer.jpg');"></div>
|
||
<div class="container">
|
||
<div class="row text-left">
|
||
<div class="col-md-6 col-12">
|
||
<h1 class="title">You should be here!</h1>
|
||
<p class="description">5,000 capacity venue, holding some of the latest technology lighting with a 24 colour laser system Amnesia is one of the islands most legendary clubs.</p>
|
||
<div class="row">
|
||
<div class="col-md-12 col-sm-8 mb-3">
|
||
<div class="row">
|
||
<div class="form-group no-border">
|
||
<input type="text" value="Full Name" class="form-control" />
|
||
</div>
|
||
<div class="form-group no-border">
|
||
<input type="email" value="Your Email" class="form-control" />
|
||
</div>
|
||
<a class="btn btn-primary btn-icon btn-round" href="javascript:;">
|
||
<i class="tim-icons icon-send"></i>
|
||
</a>
|
||
</div>
|
||
<div class="form-check">
|
||
<label class="form-check-label">
|
||
<input class="form-check-input" type="checkbox">
|
||
<span class="form-check-sign"></span>
|
||
I agree to the
|
||
<a href="javascript:void(0)">terms and conditions</a>.
|
||
</label>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="customer-logos">
|
||
<div class="slide">
|
||
<img src="https://www.solodev.com/assets/carousel/image1.png">
|
||
</div>
|
||
<div class="slide">
|
||
<img src="https://www.solodev.com/assets/carousel/image2.png">
|
||
</div>
|
||
<div class="slide">
|
||
<img src="https://www.solodev.com/assets/carousel/image3.png">
|
||
</div>
|
||
<div class="slide">
|
||
<img src="https://www.solodev.com/assets/carousel/image4.png">
|
||
</div>
|
||
<div class="slide">
|
||
<img src="https://www.solodev.com/assets/carousel/image5.png">
|
||
</div>
|
||
<div class="slide">
|
||
<img src="https://www.solodev.com/assets/carousel/image6.png">
|
||
</div>
|
||
<div class="slide">
|
||
<img src="https://www.solodev.com/assets/carousel/image7.png">
|
||
</div>
|
||
<div class="slide">
|
||
<img src="https://www.solodev.com/assets/carousel/image8.png">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END HEADER 2 ********* -->
|
||
<!-- ********* HEADER 3 ********* -->
|
||
<div class="header header-3">
|
||
<nav class="navbar navbar-expand-lg navbar-transparent navbar-absolute">
|
||
<div class="container">
|
||
<div class="navbar-translate">
|
||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#example-header-3" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||
<span class="navbar-toggler-bar bar1"></span>
|
||
<span class="navbar-toggler-bar bar2"></span>
|
||
<span class="navbar-toggler-bar bar3"></span>
|
||
</button>
|
||
<a class="navbar-brand" href="javascript:;">Creative Tim</a>
|
||
</div>
|
||
<div class="collapse navbar-collapse" id="example-header-3">
|
||
<div class="navbar-collapse-header">
|
||
<div class="row">
|
||
<div class="col-6 collapse-brand">
|
||
<a>
|
||
BLK•
|
||
<span> PRO </span>
|
||
</a>
|
||
</div>
|
||
<div class="col-6 collapse-close text-right">
|
||
<button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#example-header-3" aria-controls="navigation-index" aria-expanded="false" aria-label="Toggle navigation">
|
||
<i class="tim-icons icon-simple-remove"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<ul class="navbar-nav ml-auto">
|
||
<li class="nav-item active">
|
||
<a class="nav-link" href="javascript:;">
|
||
Home
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="javascript:;">
|
||
About Us
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="javascript:;">
|
||
Contact Us
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
<div class="page-header header-filter">
|
||
<div class="content-center">
|
||
<div class="row">
|
||
<div class="col-lg-5 col-md-8 col-12 ml-auto mr-auto positioned">
|
||
<h1 class="title">Build stunning websites and apps</h1>
|
||
<p class="description">
|
||
Meet Wingman, a robust suite of styled pages and components, powered by Bootstrap 4. The ideal starting point for product landing pages, stylish web-apps and complete company websites.
|
||
</p>
|
||
<a href="javascript:;" class="btn btn-lg btn-primary">Purchase Now</a>
|
||
</div>
|
||
<div class="col-md-12 col-md-6">
|
||
<section class="center slider">
|
||
<div>
|
||
<img src="../../static/blk-pro/assets/img/mark-harrison.jpg" height="500" width="450">
|
||
</div>
|
||
<div>
|
||
<img src="../../static/blk-pro/assets/img/steven-roe.jpg" height="500" width="450">
|
||
</div>
|
||
<div>
|
||
<img src="../../static/blk-pro/assets/img/rezaul-karim.jpg" height="500" width="450">
|
||
</div>
|
||
<div>
|
||
<img src="../../static/blk-pro/assets/img/pawel-nolbert.jpg" height="500" width="450">
|
||
</div>
|
||
<div>
|
||
<img src="../../static/blk-pro/assets/img/serge-kutuzov.jpg" height="500" width="450">
|
||
</div>
|
||
</section>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END HEADER 3 ********* -->
|
||
<!-- ********* HEADER 4 w/ VIDEO ********* -->
|
||
<div class="header header-4">
|
||
<div class="header-wrapper">
|
||
<nav class="navbar navbar-expand-lg navbar-transparent">
|
||
<div class="container">
|
||
<div class="navbar-translate">
|
||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#example-header-4" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||
<span class="navbar-toggler-bar bar1"></span>
|
||
<span class="navbar-toggler-bar bar2"></span>
|
||
<span class="navbar-toggler-bar bar3"></span>
|
||
</button>
|
||
<a class="navbar-brand" href="javascript:;">Creative Tim</a>
|
||
</div>
|
||
<div class="collapse navbar-collapse" id="example-header-4">
|
||
<div class="navbar-collapse-header">
|
||
<div class="row">
|
||
<div class="col-6 collapse-brand">
|
||
<a>
|
||
BLK•
|
||
<span> PRO </span>
|
||
</a>
|
||
</div>
|
||
<div class="col-6 collapse-close text-right">
|
||
<button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#example-header-4" aria-controls="navigation-index" aria-expanded="false" aria-label="Toggle navigation">
|
||
<i class="tim-icons icon-simple-remove"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<ul class="navbar-nav mx-auto">
|
||
<li class="nav-item active">
|
||
<a class="nav-link" href="javascript:;">
|
||
Home
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="javascript:;">
|
||
About Us
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="javascript:;">
|
||
Products
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="javascript:;">
|
||
Contact Us
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
<ul class="nav navbar-nav navbar-right">
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="https://twitter.com/CreativeTim">
|
||
<i class="fab fa-twitter"></i>
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="https://www.facebook.com/CreativeTim">
|
||
<i class="fab fa-facebook-square"></i>
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="https://www.instagram.com/CreativeTimOfficial">
|
||
<i class="fab fa-instagram"></i>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
<div class="page-header header-video header-filter">
|
||
<div class="overlay"></div>
|
||
<video playsinline="playsinline" autoplay="autoplay" muted="muted" loop="loop">
|
||
<source src="https://storage.googleapis.com/coverr-main/mp4/Mt_Baker.mp4" type="video/mp4">
|
||
</video>
|
||
<div class="container text-center">
|
||
<div class="video-text">
|
||
<h2 class="description">Make it</h2>
|
||
<h1 class="title">Stand out</h1>
|
||
<br/>
|
||
<a href="javascript:;" class="btn btn-simple btn-neutral">Dare for more</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END HEADER 4 ********* -->
|
||
<!-- ********* HEADER 5 ********* -->
|
||
<div class="header header-5">
|
||
<nav class="navbar navbar-expand-lg bg-default navbar-absolute">
|
||
<div class="container">
|
||
<div class="navbar-translate">
|
||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#example-header-5" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||
<span class="navbar-toggler-bar bar1"></span>
|
||
<span class="navbar-toggler-bar bar2"></span>
|
||
<span class="navbar-toggler-bar bar3"></span>
|
||
</button>
|
||
<a class="navbar-brand" href="javascript:;">Creative Tim</a>
|
||
</div>
|
||
<div class="collapse navbar-collapse" id="example-header-5">
|
||
<div class="navbar-collapse-header">
|
||
<div class="row">
|
||
<div class="col-6 collapse-brand">
|
||
<a>
|
||
BLK•
|
||
<span> PRO </span>
|
||
</a>
|
||
</div>
|
||
<div class="col-6 collapse-close text-right">
|
||
<button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#example-header-5" aria-controls="navigation-index" aria-expanded="false" aria-label="Toggle navigation">
|
||
<i class="tim-icons icon-simple-remove"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<ul class="navbar-nav ml-auto">
|
||
<li class="nav-item active">
|
||
<a class="nav-link" href="javascript:;">
|
||
Home
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="javascript:;">
|
||
About Us
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="javascript:;">
|
||
Contact Us
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
<div class="page-header">
|
||
<div class="container">
|
||
<div class="row align-items-center mt-md-5">
|
||
<div class="col-lg-6 col-md-8 ml-auto mr-auto">
|
||
<div class="logo">
|
||
<div class="logo-image">
|
||
<img src="../../static/blk-pro/assets/img/creative-tim-white-slim2.png">
|
||
</div>
|
||
</div>
|
||
<h2 class="title text-left">Start learning coding with the best programmers and with the best technology</h2>
|
||
<div class="input-group">
|
||
<input type="text" class="form-control" placeholder="Email me when it's done">
|
||
<div class="input-group-append">
|
||
<span class="input-group-text"><i class="tim-icons icon-lock-circle"></i></span>
|
||
</div>
|
||
</div>
|
||
<a class="btn btn-info btn-simple btn-icon" href="">
|
||
<i class="tim-icons icon-send"></i>
|
||
</a>
|
||
</div>
|
||
<div class="col-lg-4 ml-auto text-center">
|
||
<div class="phone-container">
|
||
<img src="../../static/blk-pro/assets/img/iphone2.png" class="phone">
|
||
</div>
|
||
<img src="../../static/blk-pro/assets/img/patrat.png" class="shape">
|
||
<img src="../../static/blk-pro/assets/img/cercuri.png" class="shape2">
|
||
<img src="../../static/blk-pro/assets/img/waves.png" class="shape3">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END HEADER 5 ********* -->
|
||
<!-- ********* HEADER 6 ********* -->
|
||
<div class="header header-6">
|
||
<nav class="navbar navbar-expand-lg navbar-transparent">
|
||
<div class="container">
|
||
<div class="navbar-translate">
|
||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#example-header-6" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||
<span class="navbar-toggler-bar bar1"></span>
|
||
<span class="navbar-toggler-bar bar2"></span>
|
||
<span class="navbar-toggler-bar bar3"></span>
|
||
</button>
|
||
<a class="navbar-brand" href="javascript:;">Creative Tim</a>
|
||
</div>
|
||
<div class="collapse navbar-collapse" id="example-header-6">
|
||
<div class="navbar-collapse-header">
|
||
<div class="row">
|
||
<div class="col-6 collapse-brand">
|
||
<a>
|
||
BLK•
|
||
<span> PRO </span>
|
||
</a>
|
||
</div>
|
||
<div class="col-6 collapse-close text-right">
|
||
<button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#example-header-6" aria-controls="navigation-index" aria-expanded="false" aria-label="Toggle navigation">
|
||
<i class="tim-icons icon-simple-remove"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<ul class="navbar-nav mx-auto">
|
||
<li class="nav-item active">
|
||
<a class="nav-link" href="javascript:;">
|
||
Home
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="javascript:;">
|
||
About Us
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="javascript:;">
|
||
Products
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="javascript:;">
|
||
Contact Us
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
<ul class="nav navbar-nav navbar-right">
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="https://twitter.com/CreativeTim">
|
||
<i class="fab fa-twitter"></i>
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="https://www.facebook.com/CreativeTim">
|
||
<i class="fab fa-facebook-square"></i>
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" href="https://www.instagram.com/CreativeTimOfficial">
|
||
<i class="fab fa-instagram"></i>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
<div class="page-header">
|
||
<div class="content-center">
|
||
<div class="container">
|
||
<div class="row align-items-center text-left">
|
||
<div class="col-lg-6 col-12">
|
||
<h1 class="title">Integrated
|
||
<br><strong class="text-info">Front marketing</strong></h1>
|
||
<p class="description">We aim high at being focused on building relationships with our clients and community. Using our creative gifts drives this foundation.</p>
|
||
<div class="row row-input">
|
||
<div class="col-sm-8 col-12 mt-1">
|
||
<input type="email" class="form-control" name="email" id="signupSrEmail" placeholder="Your email" aria-label="Your email">
|
||
</div>
|
||
<div class="col-sm-4 col-12">
|
||
<button type="submit" class="btn btn-info btn-block">Get Started</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-6 col-12">
|
||
<img src="../../static/blk-pro/assets/img/shape-s.png" class="path path3">
|
||
<!-- SVG Illustration -->
|
||
<figure class="header-shape">
|
||
<svg x="0px" y="0px" viewBox="10 12 878.9 907" style="enable-background:new 10 12 878.9 907;" xml:space="preserve" class="injected-svg js-svg-injector">
|
||
<g>
|
||
<defs>
|
||
<path id="shape1" d="M300.34,75.35C379.42-7.43,305.86,185.78,540.87,98.95,647.68,46,677,219,674.65,258.55c-11,185-132.32,65-13.89,317.66,56.86,121.32-94.88,256-155.89,151.41-55.11-94.48-151.56-85.1-189-90.54-311-45.27-9.33-148.52-125.21-256.78C9.7,211.2,190.5,100.86,306.34,70.35Z"></path>
|
||
</defs>
|
||
<clipPath id="shape2">
|
||
<use xlink:href="#shape1" style="overflow:visible;"></use>
|
||
</clipPath>
|
||
<g clip-path="url(#shape2)">
|
||
<image id="imageShape1" style="overflow:visible;" width="800" height="900" xlink:href="assets/img/img_352.png" transform="matrix(0.9488 0 0 0.9488 25 53.1187)"></image>
|
||
</g>
|
||
</g>
|
||
<g>
|
||
<defs>
|
||
<path id="shape3" d="M186.26,647.36c7,1,14,1.87,21.11,2.4,42.73,3.24,173.84,9.32,234.51,60.15,72.83,61,105.38,80.19,37.4,96.45C388.73,828,438.49,724,312,749.28c-167.3,33.46-210.61-70.86-181.08-90.54C151.8,644.8,174.69,645.67,186.26,647.36Z"></path>
|
||
</defs>
|
||
<clipPath id="shape4">
|
||
<use xlink:href="#shape3" style="overflow:visible;"></use>
|
||
</clipPath>
|
||
<g transform="matrix(1 0 0 1 0 0)" clip-path="url(#shape4)">
|
||
<image id="imageShape2" style="overflow:visible;" width="900" height="900" xlink:href="assets/img/img_352.png" transform="matrix(0.9488 0 0 0.9488 25 53.1187)"> </image>
|
||
</g>
|
||
</g>
|
||
</svg>
|
||
</figure>
|
||
<!-- End SVG Illustration -->
|
||
<!-- <div class="item item--style-2" data-animation-path-duration="1500" data-animation-path-easing="easeOutElastic" data-morph-path="M 418.1,159.8 C 460.9,222.9 497,321.5 452.4,383.4 417.2,432.4 371.2,405.6 271.3,420.3 137.2,440 90.45,500.6 42.16,442.8 -9.572,381 86.33,289.1 117.7,215.5 144.3,153.4 145.7,54.21 212.7,36.25 290.3,15.36 373.9,94.6 418.1,159.8 Z" data-path-scaleY="1.1" data-image-scaleX="1.3" data-image-scaleY="1.3" data-animation-deco-duration="2000" data-animation-deco-delay="100" data-deco-rotate="-10">
|
||
<svg class="item__svg" viewBox="0 0 500 500">
|
||
<clipPath id="clipShape2">
|
||
<path class="item__clippath" d="M 378.1,121.2 C 408.4,150 417.2,197.9 411,245.8 404.8,293.7 383.5,341.7 353.4,370.7 303.2,419.1 198.7,427.7 144.5,383.8 86.18,336.5 67.13,221.3 111.9,161 138.6,125 188.9,99.62 240.7,90.92 292.4,82.24 345.6,90.32 378.1,121.2 Z" />
|
||
</clipPath>
|
||
<g class="item__deco">
|
||
<use xlink:href="#deco2" />
|
||
</g>
|
||
<g clip-path="url(#clipShape2)">
|
||
<image class="item__img" xlink:href="assets/img/chester-wade.jpg" x="0" y="0" />
|
||
</g>
|
||
</svg>
|
||
</div> -->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END HEADER 6 ********* -->
|
||
</div>
|
||
<div class="cd-section" id="features">
|
||
<!-- ********* FEATURES 1 ********* -->
|
||
<div class="features-1">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-8 ml-auto mr-auto">
|
||
<span class="badge badge-primary badge-pill">Insight</span>
|
||
<h1 class="title">Full-Funnel Social Analytics</h1>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-md-4">
|
||
<div class="info info-hover">
|
||
<div class="icon icon-primary">
|
||
<img class="bg-blob" src="../../static/blk-pro/assets/img/feature-blob/primary.png">
|
||
<i class="tim-icons icon-user-run"></i>
|
||
</div>
|
||
<h4 class="info-title">Social Conversations</h4>
|
||
<p class="description">Gain access to the demographics, psychographics, and location of unique people.</p>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="info info-hover">
|
||
<div class="icon icon-success">
|
||
<img class="bg-blob" src="../../static/blk-pro/assets/img/feature-blob/success.png">
|
||
<i class="tim-icons icon-atom"></i>
|
||
</div>
|
||
<h4 class="info-title">Analyze Performance</h4>
|
||
<p class="description">Unify data from Facebook, Instagram, Twitter, LinkedIn, and Youtube to gain rich insights.</p>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="info info-hover">
|
||
<div class="icon icon-warning">
|
||
<img class="bg-blob" src="../../static/blk-pro/assets/img/feature-blob/warning.png">
|
||
<i class="tim-icons icon-gift-2"></i>
|
||
</div>
|
||
<h4 class="info-title">Measure Conversions</h4>
|
||
<p class="description">Track actions taken on your website, understand the impact on your bottom line.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END FEATURES 1 ********* -->
|
||
<!-- ********* FEATURES 2 ********* -->
|
||
<div class="features-2">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-lg-3 col-md-8 mr-auto text-left">
|
||
<h1 class="title">You should be here!</h1>
|
||
<p class="description">5,000 capacity venue, holding some of the latest technology lighting with a 24 colour laser system Amnesia is one of the islands most legendary clubs.</p>
|
||
<a class="btn btn-info btn-simple" href="javascript:;">
|
||
Learn more <i class="tim-icons icon-alert-circle-exc"></i>
|
||
</a>
|
||
</div>
|
||
<div class="col-lg-8 col-md-12">
|
||
<div class="row">
|
||
<div class="col-lg-4 col-md-4">
|
||
<div class="info text-left bg-info">
|
||
<div class="icon icon-white">
|
||
<i class="tim-icons icon-satisfied"></i>
|
||
</div>
|
||
<h4 class="info-title">Best Quality</h4>
|
||
<p class="description">Gain access to the demographics, psychographics, and location of unique people.</p>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-4 col-md-4">
|
||
<div class="info text-left bg-danger info-raised">
|
||
<div class="icon icon-white">
|
||
<i class="tim-icons icon-palette"></i>
|
||
</div>
|
||
<h4 class="info-title">Awesome Design</h4>
|
||
<p class="description">Gain access to the demographics, psychographics, and location of unique people.</p>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-4 col-md-4">
|
||
<div class="info text-left bg-default">
|
||
<div class="icon icon-white">
|
||
<i class="tim-icons icon-spaceship"></i>
|
||
</div>
|
||
<h4 class="info-title">Great Performance</h4>
|
||
<p class="description">Gain access to the demographics, psychographics, and location of unique people.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-lg-4 col-md-4">
|
||
<div class="info text-left bg-primary">
|
||
<div class="icon icon-white">
|
||
<i class="tim-icons icon-user-run"></i>
|
||
</div>
|
||
<h4 class="info-title">Fast Development</h4>
|
||
<p class="description">Gain access to the demographics, psychographics, and location of unique people.</p>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-4 col-md-4">
|
||
<div class="info text-left bg-warning info-raised">
|
||
<div class="icon icon-white">
|
||
<i class="tim-icons icon-bulb-63"></i>
|
||
</div>
|
||
<h4 class="info-title">Super Fresh</h4>
|
||
<p class="description">Gain access to the demographics, psychographics, and location of unique people.</p>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-4 col-md-4">
|
||
<div class="info text-left bg-success">
|
||
<div class="icon icon-default">
|
||
<i class="tim-icons icon-paper"></i>
|
||
</div>
|
||
<h4 class="info-title text-muted">Organized Content</h4>
|
||
<p class="description text-muted">Gain access to the demographics, psychographics, and location of unique people.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END FEATURES 2 ********* -->
|
||
<!-- ********* FEATURES 3 ********* -->
|
||
<div class="features-3">
|
||
<div class="container-fluid">
|
||
<div class="row">
|
||
<div class="col-md-6 mr-auto ml-auto">
|
||
<h1 class="title">Trello lets you work more.</h1>
|
||
<h4 class="description">Trello’s boards, lists, and cards enable you to organize and prioritize your projects in a fun, flexible and rewarding way.</h4>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-md-5 ml-auto">
|
||
<div class="info info-horizontal">
|
||
<div class="icon icon-success">
|
||
<img class="bg-blob" src="../../static/blk-pro/assets/img/feature-blob/success.png">
|
||
<i class="tim-icons icon-html5"></i>
|
||
</div>
|
||
<div class="description">
|
||
<h3 class="info-title">For Developers</h3>
|
||
<p>The moment you use Black Kit, you know you’ve never felt anything like it. With a single use, this powerfull UI Kit lets you do more than ever before. </p>
|
||
<a class="btn btn-info btn-link" href="javascript:;">Explore now <i class="tim-icons icon-minimal-right"></i> </a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-5 mr-auto">
|
||
<div class="info info-horizontal">
|
||
<div class="icon icon-warning">
|
||
<img class="bg-blob" src="../../static/blk-pro/assets/img/feature-blob/warning.png">
|
||
<i class="tim-icons icon-heart-2"></i>
|
||
</div>
|
||
<div class="description">
|
||
<h3 class="info-title">For Designers</h3>
|
||
<p>The moment you use Black Kit, you know you’ve never felt anything like it. With a single use, this powerfull UI Kit lets you do more than ever before. </p>
|
||
<a class="btn btn-info btn-link" href="javascript:;">Explore now <i class="tim-icons icon-minimal-right"></i> </a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-md-5 ml-auto">
|
||
<div class="info info-horizontal">
|
||
<div class="icon icon-danger">
|
||
<img class="bg-blob" src="../../static/blk-pro/assets/img/feature-blob/danger.png">
|
||
<i class="tim-icons icon-chart-bar-32"></i>
|
||
</div>
|
||
<div class="description">
|
||
<h3 class="info-title">For Bootstrap Lovers</h3>
|
||
<p>The moment you use Black Kit, you know you’ve never felt anything like it. With a single use, this powerfull UI Kit lets you do more than ever before. </p>
|
||
<a class="btn btn-info btn-link" href="javascript:;">Explore now <i class="tim-icons icon-minimal-right"></i> </a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-5 mr-auto">
|
||
<div class="info info-horizontal">
|
||
<div class="icon icon-info">
|
||
<img class="bg-blob" src="../../static/blk-pro/assets/img/feature-blob/info.png">
|
||
<i class="tim-icons icon-paper"></i>
|
||
</div>
|
||
<div class="description">
|
||
<h3 class="info-title">Documentation
|
||
<span class="badge badge-info badge-pill">v2.0</span>
|
||
</h3>
|
||
<p>The moment you use Black Kit, you know you’ve never felt anything like it. With a single use, this powerfull UI Kit lets you do more than ever before. </p>
|
||
<a class="btn btn-info btn-link" href="javascript:;">Explore now <i class="tim-icons icon-minimal-right"></i> </a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END FEATURES 3 ********* -->
|
||
<!-- ********* FEATURES 4 ********* -->
|
||
<div class="features-4">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-lg-3 mr-auto text-left">
|
||
<h1 class="title">You should be here!</h1>
|
||
<p class="description">5,000 capacity venue, holding some of the latest technology lighting with a 24 colour laser system Amnesia is one of the islands most legendary clubs.</p>
|
||
<a class="btn btn-primary mt-3" href="javascript:;">
|
||
Learn more <i class="tim-icons icon-double-right"></i>
|
||
</a>
|
||
</div>
|
||
<div class="col-lg-8 p-sm-0">
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<div class="info info-primary">
|
||
<div class="icon icon-white">
|
||
<i class="tim-icons icon-satisfied"></i>
|
||
</div>
|
||
<h4 class="info-title">Best Quality</h4>
|
||
<p class="description">Gain access to the demographics, psychographics, and location of unique people.</p>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="info info-primary">
|
||
<div class="icon icon-white">
|
||
<i class="tim-icons icon-palette"></i>
|
||
</div>
|
||
<h4 class="info-title">Awesome Design</h4>
|
||
<p class="description">Gain access to the demographics, psychographics, and location of unique people.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<div class="info info-primary">
|
||
<div class="icon icon-white">
|
||
<i class="tim-icons icon-user-run"></i>
|
||
</div>
|
||
<h4 class="info-title">Fast Development</h4>
|
||
<p class="description">Gain access to the demographics, psychographics, and location of unique people.</p>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="info info-primary">
|
||
<div class="icon icon-white">
|
||
<i class="tim-icons icon-bulb-63"></i>
|
||
</div>
|
||
<h4 class="info-title">Super Fresh</h4>
|
||
<p class="description">Gain access to the demographics, psychographics, and location of unique people.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END FEATURES 4 ********* -->
|
||
<!-- ********* FEATURES 5 ********* -->
|
||
<div class="features features-5">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-lg-6">
|
||
<div class="featured-image">
|
||
<img src="../../static/blk-pro/assets/img/pawel-nolbert.jpg" alt="" height="600" width="500">
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-6 mt-md-5">
|
||
<h6 class="category">Read this first</h6>
|
||
<h1 class="title">Company values</h1>
|
||
<div class="row">
|
||
<div class="col-lg-6 col-md-6">
|
||
<div class="info">
|
||
<h4 class="info-title">Honest</h4>
|
||
<p class="description">Gain access to the demographics, psychographics, and location of unique people.</p>
|
||
</div>
|
||
<div class="info">
|
||
<h4 class="info-title">Efficient</h4>
|
||
<p class="description">Gain access to the demographics, psychographics, and location of unique people.</p>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-6 col-md-6">
|
||
<div class="info">
|
||
<h4 class="info-title">Helpful</h4>
|
||
<p class="description">Gain access to the demographics, psychographics, and location of unique people.</p>
|
||
</div>
|
||
<div class="info">
|
||
<h4 class="info-title">Quality</h4>
|
||
<p class="description">Gain access to the demographics, psychographics, and location of unique people.</p>
|
||
</div>
|
||
</div>
|
||
<a class="btn btn-primary btn-link ml-4" href="javascript:;">
|
||
Why we are different <i class="tim-icons icon-double-right"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END FEATURES 5 ********* -->
|
||
<!-- ********* FEATURES 6 ********* -->
|
||
<div class="features-6">
|
||
<div class="container">
|
||
<div class="row align-items-center">
|
||
<div class="col-lg-6">
|
||
<div class="info info-horizontal info-default">
|
||
<div class="icon icon-warning">
|
||
<i class="tim-icons icon-html5"></i>
|
||
</div>
|
||
<div class="description">
|
||
<h3 class="info-title">For Developers</h3>
|
||
<p>The moment you use Black Kit, you know you’ve never felt anything like it. With a single use, this powerfull UI Kit lets you do more than ever before. </p>
|
||
</div>
|
||
</div>
|
||
<div class="info info-horizontal info-default">
|
||
<div class="icon icon-info">
|
||
<i class="tim-icons icon-app"></i>
|
||
</div>
|
||
<div class="description">
|
||
<h3 class="info-title">For Designers</h3>
|
||
<p>The moment you use Black Kit, you know you’ve never felt anything like it. With a single use, this powerfull UI Kit lets you do more than ever before. </p>
|
||
</div>
|
||
</div>
|
||
<div class="info info-horizontal info-default">
|
||
<div class="icon icon-success">
|
||
<i class="tim-icons icon-bell-55"></i>
|
||
</div>
|
||
<div class="description">
|
||
<h3 class="info-title">For Beginners</h3>
|
||
<p>The moment you use Black Kit, you know you’ve never felt anything like it. With a single use, this powerfull UI Kit lets you do more than ever before. </p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-6 col-10">
|
||
<img src="../../static/blk-pro/assets/img/path2.png" class="shape">
|
||
<figure class="ie-non-standard-hero-shape">
|
||
<svg x="0px" y="0px" viewBox="10 12 878.9 907" style="enable-background:new 10 12 878.9 907;" xml:space="preserve" class="injected-svg js-svg-injector">
|
||
<g>
|
||
<defs>
|
||
<path id="firstShape" d="M329.15,403.44c30.22-62,26.51-223.94,94.06-268.46C479,98.23,560.16,257,700.68,151.61c71.25-53.44,85.54,81,160.38,172.6C1008.5,504.74,881.5,639.14,825.35,686.6c-62.54,52.85-246.14,24.42-386.7,79.28S214.07,834,202.07,702C190.39,573.57,288.69,486.43,329.15,403.44Z"></path>
|
||
</defs>
|
||
<clipPath id="secondShape">
|
||
<use xlink:href="#firstShape" style="overflow:visible;"></use>
|
||
</clipPath>
|
||
<g clip-path="url(#secondShape)">
|
||
<image id="imageShape1" style="overflow:visible;" width="900" height="900" xlink:href="assets/img/max.jpg" transform="matrix(0.9488 0 0 0.9488 25 53.1187)"></image>
|
||
</g>
|
||
</g>
|
||
<g>
|
||
<defs>
|
||
<path id="thirdShape" d="M337.17,855.62c-7.81-35.46,42.38-43.95,63.66-52.44,24.39-9.74,135.86-48,192.58-52.52,64.22-5.13,190.21-26.84,160.46,35.34-19.76,41.3-51.47,64.52-87.63,62.33-46.36-2.81-101.56,4.39-150.8,44C448.53,946.08,450.93,865,412,868,372.28,871,340.79,872.08,337.17,855.62Z"></path>
|
||
</defs>
|
||
<clipPath id="fourthShape">
|
||
<use xlink:href="#thirdShape" style="overflow:visible;"></use>
|
||
</clipPath>
|
||
<g transform="matrix(1 0 0 1 0 0)" clip-path="url(#fourthShape)">
|
||
<image id="imageShape2" style="overflow:visible;" width="900" height="1000" xlink:href="assets/img/max.jpg" transform="matrix(0.9488 0 0 0.9488 25 53.1187)"> </image>
|
||
</g>
|
||
</g>
|
||
</svg>
|
||
</figure>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END FEATURES 6 ********* -->
|
||
</div>
|
||
<div class="cd-section" id="blogs">
|
||
<!-- ********* BLOGS 1 ********* -->
|
||
<div class="section blogs-1" id="blogs-1">
|
||
<div class="container">
|
||
<h2 class="title">Our recent writings</h2>
|
||
<br/>
|
||
<div class="row align-items-center">
|
||
<div class="col-lg-6">
|
||
<div class="card card-blog card-background" data-animation="true">
|
||
<div class="full-background" style="background-image: url('../../static/blk-pro/assets/img/marc-olivier-jodoin.jpg')"></div>
|
||
<div class="card-body">
|
||
<div class="content-bottom">
|
||
<h6 class="card-category">Sales Leads</h6>
|
||
<a href="javascript:;">
|
||
<h3 class="card-title">Configure Blockchain Technology</h3>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-3">
|
||
<div class="card card-blog card-background" data-animation="true">
|
||
<div class="full-background" style="background-image: url('../../static/blk-pro/assets/img/pawel-nolbert.jpg')"></div>
|
||
<div class="card-body">
|
||
<div class="content-bottom">
|
||
<h6 class="card-category">Benchmark Report</h6>
|
||
<a href="javascript:;">
|
||
<h3 class="card-title">API Management</h3>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-3">
|
||
<div class="card card-blog card-background" data-animation="true">
|
||
<div class="full-background" style="background-image: url('../../static/blk-pro/assets/img/joshua-adam-nolette.jpg')"></div>
|
||
<div class="card-body">
|
||
<div class="content-bottom">
|
||
<h6 class="card-category">Capabilities and Limits</h6>
|
||
<a href="javascript:;">
|
||
<h3 class="card-title">Quantum Computing</h3>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END BLOGS 1 ********* -->
|
||
<!-- ********* BLOGS 2 ********* -->
|
||
<div class="section blogs-2" id="blogs-2">
|
||
<div class="container-fluid">
|
||
<h2 class="title">Our recent writings 2</h2>
|
||
<br/>
|
||
<div class="row">
|
||
<div class="col-lg-3">
|
||
<div class="card card-blog card-background" data-animation="zooming">
|
||
<div class="full-background" style="background-image: url('../../static/blk-pro/assets/img/steven-roe.jpg')"></div>
|
||
<div class="card-body">
|
||
<div class="content-bottom">
|
||
<h6 class="card-category">Research Byte</h6>
|
||
<a href="javascript:;">
|
||
<h3 class="card-title">AI at the Edge</h3>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-3">
|
||
<div class="card card-blog card-background" data-animation="zooming">
|
||
<div class="full-background" style="background-image: url('../../static/blk-pro/assets/img/noah-wetering.jpg')"></div>
|
||
<div class="card-body">
|
||
<div class="content-bottom">
|
||
<h6 class="card-category">Data Virtualization</h6>
|
||
<a href="javascript:;">
|
||
<h3 class="card-title">A Spectrum of Approaches</h3>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-3">
|
||
<div class="card card-blog card-background" data-animation="zooming">
|
||
<div class="full-background" style="background-image: url('../../static/blk-pro/assets/img/matthew-henry.jpg')"></div>
|
||
<div class="card-body">
|
||
<div class="content-bottom">
|
||
<h6 class="card-category">New Challenges</h6>
|
||
<a href="javascript:;">
|
||
<h3 class="card-title">Touch on a trend</h3>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-3">
|
||
<div class="card card-blog card-background" data-animation="zooming">
|
||
<div class="full-background" style="background-image: url('../../static/blk-pro/assets/img/waranont.jpg')"></div>
|
||
<div class="card-body">
|
||
<div class="content-bottom">
|
||
<h6 class="card-category">Driverless Future</h6>
|
||
<a href="javascript:;">
|
||
<h3 class="card-title">Self-Driving Cars</h3>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END BLOGS 2 ********* -->
|
||
<!-- ********* BLOGS 3 ********* -->
|
||
<div class="section blogs-3">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-10 ml-auto mr-auto">
|
||
<h2 class="title">Latest Blogposts 3</h2>
|
||
<br />
|
||
<div class="card card-blog card-plain blog-horizontal">
|
||
<div class="row">
|
||
<div class="col-lg-4">
|
||
<div class="card-image">
|
||
<a href="javascript:;">
|
||
<img class="img rounded" src="../../static/blk-pro/assets/img/serge-kutuzov.jpg" />
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-8">
|
||
<div class="card-body">
|
||
<h3 class="card-title">
|
||
<a href="javascript:;">Rover raised $65 million for pet sitting</a>
|
||
</h3>
|
||
<p class="card-description">
|
||
Finding temporary housing for your dog should be as easy as renting an Airbnb. That’s the idea behind Rover, which raised $65 million to expand its pet sitting and dog-walking businesses..Finding temporary housing for your dog should be as easy as renting an Airbnb. That’s the idea behind Rover, which raised $65 million to expand its pet sitting and dog-walking businesses..
|
||
<a href="javascript:;"> Read More </a>
|
||
</p>
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/julie.jpg" alt="..." class="avatar img-raised">
|
||
<div class="text">
|
||
<span class="name">Tom Hanks</span>
|
||
<div class="meta">Drawn on 23 Jan</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="card card-blog card-plain blog-horizontal">
|
||
<div class="row">
|
||
<div class="col-lg-4">
|
||
<div class="card-image">
|
||
<a href="javascript:;">
|
||
<img class="img rounded" src="../../static/blk-pro/assets/img/trae-gould.jpg" />
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-8">
|
||
<div class="card-body">
|
||
<h3 class="card-title">
|
||
<a href="javascript:;">MateLabs mixes machine learning with IFTTT</a>
|
||
</h3>
|
||
<p class="card-description">
|
||
If you’ve ever wanted to train a machine learning model and integrate it with IFTTT, you now can with a new offering from MateLabs. MateVerse, a platform where novices can spin out machine...If you’ve ever wanted to train a machine learning model and integrate it with IFTTT, you now can with a new offering from MateLabs. MateVerse, a platform where novices can spin out machine...
|
||
<a href="javascript:;"> Read More </a>
|
||
</p>
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/james.jpg" alt="..." class="avatar img-raised">
|
||
<div class="text">
|
||
<span class="name">Tom Hanks</span>
|
||
<div class="meta">Drawn on 23 Jan</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="card card-blog card-plain blog-horizontal">
|
||
<div class="row">
|
||
<div class="col-lg-4">
|
||
<div class="card-image">
|
||
<a href="javascript:;">
|
||
<img class="img rounded" src="../../static/blk-pro/assets/img/mark-harrison.jpg" />
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-8">
|
||
<div class="card-body">
|
||
<h3 class="card-title">
|
||
<a href="javascript:;">US venture investment ticks up in Q2 2017</a>
|
||
</h3>
|
||
<p class="card-description">
|
||
Venture investment in U.S. startups rose sequentially in the second quarter of 2017, boosted by large, late-stage financings and a few outsized early-stage rounds in tech and healthcare..enture investment in U.S. startups rose sequentially in the second quarter of 2017, boosted by large, late-stage financings and a few outsized early-stage rounds in tech and healthcare..
|
||
<a href="javascript:;"> Read More </a>
|
||
</p>
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/michael.jpg" alt="..." class="avatar img-raised">
|
||
<div class="text">
|
||
<span class="name">Tom Hanks</span>
|
||
<div class="meta">Drawn on 23 Jan</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END BLOGS 4 ********* -->
|
||
<div class="section blogs-4" id="blogs-4">
|
||
<div class="container-fluid">
|
||
<h2 class="title">Latest Blogposts 4</h2>
|
||
<br/>
|
||
<div class="row">
|
||
<div class="col-lg-3">
|
||
<div class="card card-blog card-background" data-animation="zooming">
|
||
<div class="full-background" style="background-image: url('../../static/blk-pro/assets/img/viktor-forgacs.jpg')"></div>
|
||
<div class="card-body">
|
||
<div class="content-bottom">
|
||
<h6 class="card-category">Climate Change</h6>
|
||
<a href="javascript:;">
|
||
<h3 class="card-title">Stellar Partnership</h3>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-3">
|
||
<div class="card card-blog card-background" data-animation="zooming">
|
||
<div class="full-background" style="background-image: url('../../static/blk-pro/assets/img/rezaul-karim.jpg')"></div>
|
||
<div class="card-body">
|
||
<div class="content-bottom">
|
||
<h6 class="card-category">Save the World</h6>
|
||
<a href="javascript:;">
|
||
<h3 class="card-title">Digital Currency</h3>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-3">
|
||
<div class="card card-blog card-background" data-animation="zooming">
|
||
<div class="full-background" style="background-image: url('../../static/blk-pro/assets/img/pawel-nolbert.jpg')"></div>
|
||
<div class="card-body">
|
||
<div class="content-bottom">
|
||
<h6 class="card-category">Applications Companies</h6>
|
||
<a href="javascript:;">
|
||
<h3 class="card-title">Blockchain Explained</h3>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-3">
|
||
<div class="card card-blog card-background" data-animation="zooming">
|
||
<div class="full-background" style="background-image: url('../../static/blk-pro/assets/img/mark-finn.jpg')"></div>
|
||
<div class="card-body">
|
||
<div class="content-bottom">
|
||
<h6 class="card-category">RFID microchips</h6>
|
||
<a href="javascript:;">
|
||
<h3 class="card-title">A Robot is Your Co-Worker</h3>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END BLOGS 4 ********* -->
|
||
<!-- ********* END BLOGS 5 ********* -->
|
||
<div class="blogs-5">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-10 ml-auto mr-auto">
|
||
<h2 class="title">Latest Blogposts 5</h2>
|
||
<div class="row">
|
||
<div class="col-lg-4 col-md-6">
|
||
<div class="card card-blog card-plain">
|
||
<div class="card-image">
|
||
<a href="javascript:;">
|
||
<img class="img rounded" src="../../static/blk-pro/assets/img/steven-roe.jpg">
|
||
</a>
|
||
</div>
|
||
<div class="card-body">
|
||
<h6 class="category text-primary">Features</h6>
|
||
<h4 class="card-title">
|
||
<a href="javascript:;">That’s One Way To Ditch Your Passenger</a>
|
||
</h4>
|
||
<p class="card-description">
|
||
As near as we can tell, this guy must have thought he was going over backwards and tapped the rear...
|
||
</p>
|
||
<div class="card-footer">
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/p10.jpg" alt="..." class="avatar img-raised">
|
||
<span>Mike John</span>
|
||
</div>
|
||
<div class="stats stats-right">
|
||
<i class="tim-icons icon-watch-time"></i> 5 min read
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-4 col-md-6">
|
||
<div class="card card-blog card-plain">
|
||
<div class="card-image">
|
||
<a href="javascript:;">
|
||
<img class="img rounded" src="../../static/blk-pro/assets/img/noah-wetering.jpg">
|
||
</a>
|
||
</div>
|
||
<div class="card-body">
|
||
<h6 class="category text-info">Animals</h6>
|
||
<h4 class="card-title">
|
||
<a href="javascript:;">Shark Week: How to Watch It Like a Scientist</a>
|
||
</h4>
|
||
<p class="card-description">
|
||
Just when you thought it was safe to turn on your television, the Discovery Channel's "Shark Week"...
|
||
</p>
|
||
<div class="card-footer">
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/johana.jpg" alt="..." class="avatar img-raised">
|
||
<span>Jona Zmud</span>
|
||
</div>
|
||
<div class="stats stats-right">
|
||
<i class="tim-icons icon-watch-time"></i> 5 min read
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-4 col-12">
|
||
<div class="card card-blog card-plain">
|
||
<div class="card-image">
|
||
<a href="javascript:;">
|
||
<img class="img rounded" src="../../static/blk-pro/assets/img/mark-harrison.jpg">
|
||
</a>
|
||
</div>
|
||
<div class="card-body">
|
||
<h6 class="category text-warning">Cars</h6>
|
||
<h4 class="card-title">
|
||
<a href="javascript:;">Who's Afraid of the Self-Driving Car?</a>
|
||
</h4>
|
||
<p class="card-description">
|
||
It's been 60 years since the cover of Popular Mechanics magazine gave us the promise of flying cars...
|
||
</p>
|
||
<div class="card-footer">
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/christian.jpg" alt="..." class="avatar img-raised">
|
||
<span>Marc Oliver</span>
|
||
</div>
|
||
<div class="stats stats-right">
|
||
<i class="tim-icons icon-heart-2"></i> 2.4K
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END BLOGS 5 ********* -->
|
||
<!-- ********* BLOGS 6 ********* -->
|
||
<div class="blogs-6">
|
||
<div class="container">
|
||
<h2 class="title">Latest Blogposts 6</h2>
|
||
<div class="row">
|
||
<div class="col-lg-10 ml-auto mr-auto">
|
||
<div class="card card-blog card-background card-grande">
|
||
<div class="full-background" style="background-image: url('../../static/blk-pro/assets/img/ben-konfrst.jpg')"></div>
|
||
<div class="card-body">
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/olivia.jpg" alt="..." class="avatar img-raised">
|
||
<span class="text-white">by Johanna Zmud</span>
|
||
</div>
|
||
<a href="javascript:;">
|
||
<h2 class="card-title">Miami Vice</h2>
|
||
</a>
|
||
<h4 class="card-description">The simplest visual description uses ordinary words to convey what the writer sees. First he or she must look at the subject – slowly, carefully, and repeatedly, if possible – to identify the parts that make the whole</h4>
|
||
<a class="btn btn-primary" href="javascript:;">
|
||
Read more...
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END BLOGS 6 ********* -->
|
||
<!-- ********* BLOGS 7 ********* -->
|
||
<div class="blogs-7">
|
||
<div class="container">
|
||
<h2 class="title">Latest Blogposts 7</h2>
|
||
<div class="row">
|
||
<div class="col-md-7">
|
||
<div class="card card-blog card-background">
|
||
<div class="full-background" style="background-image: url('../../static/blk-pro/assets/img/sendra-martorell.jpg')"></div>
|
||
<div class="card-body">
|
||
<div class="content-center">
|
||
<a href="javascript:;">
|
||
<h2 class="card-title">GigaOm Market Landscape</h2>
|
||
</a>
|
||
<h3 class="card-category">Enterprise Report</h3>
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/johana.jpg" alt="..." class="avatar img-raised">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-5">
|
||
<div class="card card-blog card-background">
|
||
<div class="full-background" style="background-image: url('../../static/blk-pro/assets/img/randy-colas.jpg')"></div>
|
||
<div class="card-body">
|
||
<div class="content-center">
|
||
<a href="javascript:;">
|
||
<h2 class="card-title">Development is Not Enough</h2>
|
||
</a>
|
||
<h3 class="card-category">Best Practices</h3>
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/p10.jpg" alt="..." class="avatar img-raised">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<br/>
|
||
<div class="row">
|
||
<div class="col-md-5">
|
||
<div class="card card-blog card-background">
|
||
<div class="full-background" style="background-image: url('../../static/blk-pro/assets/img/marc-olivier-jodoin.jpg')"></div>
|
||
<div class="card-body">
|
||
<div class="content-center">
|
||
<a href="javascript:;">
|
||
<h2 class="card-title">Improve Cyber Security </h2>
|
||
</a>
|
||
<h3 class="card-category">On Demand</h3>
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/julie.jpg" alt="..." class="avatar img-raised">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-7">
|
||
<div class="card card-blog card-background">
|
||
<div class="full-background" style="background-image: url('../../static/blk-pro/assets/img/waranont.jpg')"></div>
|
||
<div class="card-body">
|
||
<div class="content-center">
|
||
<a href="javascript:;">
|
||
<h2 class="card-title">How Blockchain Changes Everything</h2>
|
||
</a>
|
||
<h3 class="card-category">On Market</h3>
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/christian.jpg" alt="..." class="avatar img-raised">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END BLOGS 7 ********* -->
|
||
</div>
|
||
<div class="cd-section" id="teams">
|
||
<!-- ********* TEAM 1 ********* -->
|
||
<div class="team-1">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-8 ml-auto mr-auto text-center">
|
||
<h2 class="title">Our Awesome Team 1</h2>
|
||
<h4 class="description">This is the paragraph where you can write more details about your team. Keep you user engaged by providing meaningful information.</h4>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div id="carouselExampleControls" class="carousel slide carousel-team">
|
||
<div class="carousel-inner">
|
||
<div class="carousel-item active">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-4">
|
||
<h1 class="title">Charlie Watson</h1>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<img class="d-block" src="../../static/blk-pro/assets/img/charlie.jpg" alt="First slide">
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="wrapper">
|
||
<div class="category">
|
||
<strong>Position:</strong> Artist
|
||
<br/>
|
||
<strong>Experience:</strong> 5 years
|
||
</div>
|
||
<div class="description">
|
||
Artist is a term applied to a person who engages in an activity deemed to be an art. An artist also may be defined unofficially as "a person who expresses him- or herself through a medium". He is a descriptive term applied to a person who engages in an activity deemed to be an art. An artist also may be defined unofficially as "a person who expresses him- or herself through a medium".
|
||
</div>
|
||
<div class="footer">
|
||
<a href="javascript:;" class="btn btn-icon btn-twitter btn-round"><i class="fab fa-twitter"></i></a>
|
||
<a href="javascript:;" class="btn btn-icon btn-facebook btn-round"><i class="fab fa-facebook-square"></i></a>
|
||
<a href="javascript:;" class="btn btn-icon btn-dribbble btn-round"><i class="fab fa-dribbble"></i></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="carousel-item">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-4">
|
||
<h1 class="title">Quavo Austen</h1>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<img class="d-block" src="../../static/blk-pro/assets/img/tom-klein.jpg" alt="First slide">
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="wrapper">
|
||
<div class="category">
|
||
<strong>Position:</strong> Actor
|
||
<br/>
|
||
<strong>Experience:</strong> 1 year
|
||
</div>
|
||
<div class="description">
|
||
Artist is a term applied to a person who engages in an activity deemed to be an art. An artist also may be defined unofficially as "a person who expresses him- or herself through a medium". He is a descriptive term applied to a person who engages in an activity deemed to be an art. An artist also may be defined unofficially as "a person who expresses him- or herself through a medium".
|
||
</div>
|
||
<div class="footer">
|
||
<a href="javascript:;" class="btn btn-icon btn-twitter btn-round"><i class="fab fa-twitter"></i></a>
|
||
<a href="javascript:;" class="btn btn-icon btn-facebook btn-round"><i class="fab fa-facebook-square"></i></a>
|
||
<a href="javascript:;" class="btn btn-icon btn-dribbble btn-round"><i class="fab fa-dribbble"></i></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="carousel-item">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-4">
|
||
<h1 class="title">Lucy</h1>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<img class="d-block" src="../../static/blk-pro/assets/img/lucy.jpg" alt="First slide">
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="wrapper">
|
||
<div class="category">
|
||
<strong>Position:</strong> CEO
|
||
<br/>
|
||
<strong>Experience:</strong> 7 years
|
||
</div>
|
||
<div class="description">
|
||
Artist is a term applied to a person who engages in an activity deemed to be an art. An artist also may be defined unofficially as "a person who expresses him- or herself through a medium". He is a descriptive term applied to a person who engages in an activity deemed to be an art. An artist also may be defined unofficially as "a person who expresses him- or herself through a medium".
|
||
</div>
|
||
<div class="footer">
|
||
<a href="javascript:;" class="btn btn-icon btn-twitter btn-round"><i class="fab fa-twitter"></i></a>
|
||
<a href="javascript:;" class="btn btn-icon btn-facebook btn-round"><i class="fab fa-facebook-square"></i></a>
|
||
<a href="javascript:;" class="btn btn-icon btn-dribbble btn-round"><i class="fab fa-dribbble"></i></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
|
||
<i class="tim-icons icon-minimal-left"></i>
|
||
<span class="sr-only">Previous</span>
|
||
</a>
|
||
<a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
|
||
<i class="tim-icons icon-minimal-right"></i>
|
||
<span class="sr-only">Next</span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END TEAM 1 ********* -->
|
||
<!-- ********* TEAM 2 ********* -->
|
||
<div class="team-2">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-8 ml-auto mr-auto text-center">
|
||
<h2 class="title">The Executive Team 2</h2>
|
||
<h4 class="description">This is the paragraph where you can write more details about your team. Keep you user engaged by providing meaningful information.</h4>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-md-4">
|
||
<div class="card card-profile">
|
||
<div class="card-image">
|
||
<h4 class="title">Sofia Scarlett</h4>
|
||
<div class="dropdown">
|
||
<button type="button" class="btn btn-link dropdown-toggle btn-icon" data-toggle="dropdown" aria-expanded="false">
|
||
<i class="tim-icons icon-settings-gear-63"></i>
|
||
</button>
|
||
<div class="dropdown-menu dropdown-menu-right" x-placement="bottom-end">
|
||
<a class="dropdown-item" href="javascript:;">Edit Profile</a>
|
||
<a class="dropdown-item" href="javascript:;">Settings</a>
|
||
<a class="dropdown-item" href="javascript:;">Log out</a>
|
||
</div>
|
||
</div>
|
||
<a href="javascript:;">
|
||
<img class="img img-raised rounded" src="../../static/blk-pro/assets/img/emily.jpg" />
|
||
</a>
|
||
</div>
|
||
<div class="card-body">
|
||
<hr class="line-primary">
|
||
<h3 class="job-title">UX Designer</h3>
|
||
<div class="table-responsive">
|
||
<table class="table tablesorter " id="plain-table">
|
||
<tbody>
|
||
<tr>
|
||
<td class="text-left">
|
||
<i class="tim-icons icon-atom"></i> Skills
|
||
</td>
|
||
<td class="text-right">
|
||
UI, UX
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-left">
|
||
<i class="tim-icons icon-user-run"></i> Hobbies
|
||
</td>
|
||
<td class="text-right">
|
||
Cookery
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-left">
|
||
<i class="tim-icons icon-chart-bar-32"></i> Level
|
||
</td>
|
||
<td class="text-right">
|
||
• • •
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card card-profile">
|
||
<div class="card-image">
|
||
<h4 class="title">Dylan Wyatt</h4>
|
||
<div class="dropdown">
|
||
<button type="button" class="btn btn-link dropdown-toggle btn-icon" data-toggle="dropdown" aria-expanded="false">
|
||
<i class="tim-icons icon-settings-gear-63"></i>
|
||
</button>
|
||
<div class="dropdown-menu dropdown-menu-right" x-placement="bottom-end">
|
||
<a class="dropdown-item" href="javascript:;">Edit Profile</a>
|
||
<a class="dropdown-item" href="javascript:;">Settings</a>
|
||
<a class="dropdown-item" href="javascript:;">Log out</a>
|
||
</div>
|
||
</div>
|
||
<a href="javascript:;">
|
||
<img class="img img-raised rounded" src="../../static/blk-pro/assets/img/michael.jpg" />
|
||
</a>
|
||
</div>
|
||
<div class="card-body">
|
||
<hr class="line-primary">
|
||
<h3 class="job-title">Team Lead</h3>
|
||
<div class="table-responsive">
|
||
<table class="table tablesorter " id="plain-table">
|
||
<tbody>
|
||
<tr>
|
||
<td class="text-left">
|
||
<i class="tim-icons icon-atom"></i> Skills
|
||
</td>
|
||
<td class="text-right">
|
||
Leadership
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-left">
|
||
<i class="tim-icons icon-user-run"></i> Hobbies
|
||
</td>
|
||
<td class="text-right">
|
||
Skiing
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-left">
|
||
<i class="tim-icons icon-chart-bar-32"></i> Level
|
||
</td>
|
||
<td class="text-right">
|
||
• • • • •
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card card-profile">
|
||
<div class="card-image">
|
||
<h4 class="title">Mila Skylar</h4>
|
||
<div class="dropdown">
|
||
<button type="button" class="btn btn-link dropdown-toggle btn-icon" data-toggle="dropdown" aria-expanded="false">
|
||
<i class="tim-icons icon-settings-gear-63"></i>
|
||
</button>
|
||
<div class="dropdown-menu dropdown-menu-right" x-placement="bottom-end">
|
||
<a class="dropdown-item" href="javascript:;">Edit Profile</a>
|
||
<a class="dropdown-item" href="javascript:;">Settings</a>
|
||
<a class="dropdown-item" href="javascript:;">Log out</a>
|
||
</div>
|
||
</div>
|
||
<a href="javascript:;">
|
||
<img class="img img-raised rounded" src="../../static/blk-pro/assets/img/julie.jpg" />
|
||
</a>
|
||
</div>
|
||
<div class="card-body">
|
||
<hr class="line-primary">
|
||
<h3 class="job-title">Content writer</h3>
|
||
<div class="table-responsive">
|
||
<table class="table tablesorter " id="plain-table">
|
||
<tbody>
|
||
<tr>
|
||
<td class="text-left">
|
||
<i class="tim-icons icon-atom"></i> Skills
|
||
</td>
|
||
<td class="text-right">
|
||
Artistry
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-left">
|
||
<i class="tim-icons icon-user-run"></i> Hobbies
|
||
</td>
|
||
<td class="text-right">
|
||
Reading
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-left">
|
||
<i class="tim-icons icon-chart-bar-32"></i> Level
|
||
</td>
|
||
<td class="text-right">
|
||
• • • •
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END TEAM 2 ********* -->
|
||
<!-- ********* TEAM 3 ********* -->
|
||
<div class="team-3">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-8 ml-auto mr-auto text-center">
|
||
<h2 class="title">The Executive Team 3</h2>
|
||
<h4 class="description">This is the paragraph where you can write more details about your team. Keep you user engaged by providing meaningful information.</h4>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-lg-4 col-md-5 ml-auto mr-auto">
|
||
<div class="card card-profile" data-background="full">
|
||
<a href="javascript:;">
|
||
<img class="img img-raised rounded" src="../../static/blk-pro/assets/img/willy-dade.jpg" />
|
||
</a>
|
||
<div class="card-image">
|
||
<h4 class="title">Jane Doe</h4>
|
||
<div class="dropdown">
|
||
<button type="button" class="btn btn-link dropdown-toggle btn-icon" data-toggle="dropdown" aria-expanded="false">
|
||
<i class="tim-icons icon-settings-gear-63"></i>
|
||
</button>
|
||
<div class="dropdown-menu dropdown-menu-right" x-placement="bottom-end">
|
||
<a class="dropdown-item" href="javascript:;">Edit Profile</a>
|
||
<a class="dropdown-item" href="javascript:;">Settings</a>
|
||
<a class="dropdown-item" href="javascript:;">Log out</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="card-body">
|
||
<hr class="line-primary">
|
||
<h3 class="job-title">Scrum Master</h3>
|
||
<div class="table-responsive">
|
||
<table class="table tablesorter " id="plain-table">
|
||
<tbody>
|
||
<tr>
|
||
<td class="text-left">
|
||
<i class="tim-icons icon-atom"></i> Skills
|
||
</td>
|
||
<td class="text-right">
|
||
Organization
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-left">
|
||
<i class="tim-icons icon-user-run"></i> Hobbies
|
||
</td>
|
||
<td class="text-right">
|
||
Jogging
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-left">
|
||
<i class="tim-icons icon-chart-bar-32"></i> Level
|
||
</td>
|
||
<td class="text-right">
|
||
• • • • •
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-4 col-md-5 ml-auto mr-auto">
|
||
<div class="card card-profile" data-background="full">
|
||
<a href="javascript:;">
|
||
<img class="img img-raised rounded" src="../../static/blk-pro/assets/img/tom-klein.jpg" />
|
||
</a>
|
||
<div class="card-image">
|
||
<h4 class="title">Tom Klein</h4>
|
||
<div class="dropdown">
|
||
<button type="button" class="btn btn-link dropdown-toggle btn-icon" data-toggle="dropdown" aria-expanded="false">
|
||
<i class="tim-icons icon-settings-gear-63"></i>
|
||
</button>
|
||
<div class="dropdown-menu dropdown-menu-right" x-placement="bottom-end">
|
||
<a class="dropdown-item" href="javascript:;">Edit Profile</a>
|
||
<a class="dropdown-item" href="javascript:;">Settings</a>
|
||
<a class="dropdown-item" href="javascript:;">Log out</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="card-body">
|
||
<hr class="line-primary">
|
||
<h3 class="job-title">CTO</h3>
|
||
<div class="table-responsive">
|
||
<table class="table tablesorter " id="plain-table">
|
||
<tbody>
|
||
<tr>
|
||
<td class="text-left">
|
||
<i class="tim-icons icon-atom"></i> Skills
|
||
</td>
|
||
<td class="text-right">
|
||
Negotiation
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-left">
|
||
<i class="tim-icons icon-user-run"></i> Hobbies
|
||
</td>
|
||
<td class="text-right">
|
||
Graffiti
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-left">
|
||
<i class="tim-icons icon-chart-bar-32"></i> Level
|
||
</td>
|
||
<td class="text-right">
|
||
• • • •
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-4 col-md-5 ml-auto mr-auto">
|
||
<div class="card card-profile" data-background="full">
|
||
<a href="javascript:;">
|
||
<img class="img img-raised rounded" src="../../static/blk-pro/assets/img/kareya-saleh.jpg" />
|
||
</a>
|
||
<div class="card-image">
|
||
<h4 class="title">Hannah Khan</h4>
|
||
<div class="dropdown">
|
||
<button type="button" class="btn btn-link dropdown-toggle btn-icon" data-toggle="dropdown" aria-expanded="false">
|
||
<i class="tim-icons icon-settings-gear-63"></i>
|
||
</button>
|
||
<div class="dropdown-menu dropdown-menu-right" x-placement="bottom-end">
|
||
<a class="dropdown-item" href="javascript:;">Edit Profile</a>
|
||
<a class="dropdown-item" href="javascript:;">Settings</a>
|
||
<a class="dropdown-item" href="javascript:;">Log out</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="card-body">
|
||
<hr class="line-primary">
|
||
<h3 class="job-title">Brand Strategist</h3>
|
||
<div class="table-responsive">
|
||
<table class="table tablesorter " id="plain-table">
|
||
<tbody>
|
||
<tr>
|
||
<td class="text-left">
|
||
<i class="tim-icons icon-atom"></i> Skills
|
||
</td>
|
||
<td class="text-right">
|
||
Decision Making
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-left">
|
||
<i class="tim-icons icon-user-run"></i> Hobbies
|
||
</td>
|
||
<td class="text-right">
|
||
Martial arts
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="text-left">
|
||
<i class="tim-icons icon-chart-bar-32"></i> Level
|
||
</td>
|
||
<td class="text-right">
|
||
• • •
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END TEAM 3 ********* -->
|
||
<!-- ********* TEAM 4 ********* -->
|
||
<div class="team-4">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-8 ml-auto mr-auto text-center">
|
||
<h2 class="title">The Executive Team 4</h2>
|
||
<h4 class="description">This is the paragraph where you can write more details about your team. Keep you user engaged by providing meaningful information.</h4>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-lg-10 ml-auto mr-auto">
|
||
<div class="card card-profile card-horizontal">
|
||
<div class="row">
|
||
<div class="col-xl-7">
|
||
<div class="card-image no-mask">
|
||
<a href="javascript:;">
|
||
<img class="img" src="../../static/blk-pro/assets/img/comete-coco.jpg" />
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="col-xl-5">
|
||
<div class="card-body mt-3">
|
||
<h6 class="card-category">Name</h6>
|
||
<h4 class="card-title">Willian Pearce</h4>
|
||
<br/>
|
||
<h6 class="card-category">Position</h6>
|
||
<h4 class="card-title">Project Manager</h4>
|
||
<br/>
|
||
<div class="row">
|
||
<div class="col-lg-4">
|
||
<h6 class="card-category">Followers</h6>
|
||
<h4 class="card-title">367</h4>
|
||
</div>
|
||
<div class="col-lg-4">
|
||
<h6 class="card-category">Projects</h6>
|
||
<h4 class="card-title">31</h4>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="card-footer">
|
||
<h6 class="card-category">Team</h6>
|
||
<a href="javascript:;" class="avatar rounded-circle" data-toggle="tooltip" data-original-title="Ryan Tompson">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/james.jpg">
|
||
</a>
|
||
<a href="javascript:;" class="avatar rounded-circle" data-toggle="tooltip" data-original-title="Romina Hadid">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/ryan.jpg">
|
||
</a>
|
||
<a href="javascript:;" class="avatar rounded-circle" data-toggle="tooltip" data-original-title="Alexander Smith">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/lora.jpg">
|
||
</a>
|
||
<a href="javascript:;" class="avatar rounded-circle" data-toggle="tooltip" data-original-title="Jessica Doe">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/mike.jpg">
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END TEAM 4 ********* -->
|
||
<!-- ********* TEAM 5 ********* -->
|
||
<div class="team-5">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-8 ml-auto mr-auto text-center">
|
||
<h2 class="title">The Executive Team 5</h2>
|
||
<h4 class="description">This is the paragraph where you can write more details about your team. Keep you user engaged by providing meaningful information.</h4>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-md-4">
|
||
<div class="card card-profile profile-bg">
|
||
<div class="card-header" style="background-image: url('../../static/blk-pro/assets/img/ben-konfrst.jpg')">
|
||
<div class="card-avatar">
|
||
<a href="javascript:;">
|
||
<img class="img img-raised" src="../../static/blk-pro/assets/img/ryan.jpg" />
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="card-body">
|
||
<h3 class="card-title">Byron Reese</h3>
|
||
<h6 class="category text-primary">Credit Analyst</h6>
|
||
<p class="card-description">
|
||
Multi-Cloud Object Storage and Data Mobility: A GigaOm Market Landscape Report has been announced...
|
||
</p>
|
||
</div>
|
||
<div class="card-footer">
|
||
<div class="follow float-left">
|
||
<a class="btn btn-primary btn-sm btn-simple" href="javascript:;">
|
||
<i class="tim-icons icon-check-2"></i> Following
|
||
</a>
|
||
</div>
|
||
<div class="d-inline float-right d-md-block">
|
||
<a href="javascript:;" class="btn btn-icon btn-dribbble btn-round"><i class="fab fa-dribbble"></i></a>
|
||
<a href="javascript:;" class="btn btn-icon btn-linkedin btn-round"><i class="fab fa-linkedin"></i></a>
|
||
<a href="javascript:;" class="btn btn-icon btn-behance btn-round"><i class="fab fa-behance"></i></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card card-profile profile-bg">
|
||
<div class="card-header" style="background-image: url('../../static/blk-pro/assets/img/ruvim-noga.jpg')">
|
||
<div class="card-avatar">
|
||
<a href="javascript:;">
|
||
<img class="img img-raised" src="../../static/blk-pro/assets/img/lora.jpg" />
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="card-body">
|
||
<h3 class="card-title">Melanie Paisley</h3>
|
||
<h6 class="category text-primary">Writer</h6>
|
||
<p class="card-description">
|
||
Over the years, advancement in CRM technology has reshaped the way SMBs and SMEs manage their workflows...
|
||
</p>
|
||
</div>
|
||
<div class="card-footer">
|
||
<div class="follow float-left">
|
||
<a class="btn btn-primary btn-sm" href="javascript:;">Follow </a>
|
||
</div>
|
||
<div class="d-inline float-right d-md-block">
|
||
<a href="javascript:;" class="btn btn-icon btn-dribbble btn-round"><i class="fab fa-dribbble"></i></a>
|
||
<a href="javascript:;" class="btn btn-icon btn-linkedin btn-round"><i class="fab fa-linkedin"></i></a>
|
||
<a href="javascript:;" class="btn btn-icon btn-behance btn-round"><i class="fab fa-behance"></i></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card card-profile profile-bg">
|
||
<div class="card-header" style="background-image: url('../../static/blk-pro/assets/img/sendra-martorell.jpg')">
|
||
<div class="card-avatar">
|
||
<a href="javascript:;">
|
||
<img class="img img-raised" src="../../static/blk-pro/assets/img/ryan.png" />
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="card-body">
|
||
<h3 class="card-title">Jon Collins</h3>
|
||
<h6 class="category text-primary">Data Specialist</h6>
|
||
<p class="card-description">
|
||
Scaling DevOps: Strategy & Technical Considerations for Successful Enterprise DevOps
|
||
</p>
|
||
</div>
|
||
<div class="card-footer">
|
||
<div class="follow float-left">
|
||
<a class="btn btn-primary btn-sm btn-simple" href="javascript:;">
|
||
<i class="tim-icons icon-check-2"></i> Following
|
||
</a>
|
||
</div>
|
||
<div class="d-inline float-right d-md-block">
|
||
<a href="javascript:;" class="btn btn-icon btn-dribbble btn-round"><i class="fab fa-dribbble"></i></a>
|
||
<a href="javascript:;" class="btn btn-icon btn-linkedin btn-round"><i class="fab fa-linkedin"></i></a>
|
||
<a href="javascript:;" class="btn btn-icon btn-behance btn-round"><i class="fab fa-behance"></i></a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END TEAM 5 ********* -->
|
||
</div>
|
||
<div class="cd-section" id="projects">
|
||
<!-- ********* PROJECTS 1 ********* -->
|
||
<div class="projects-1">
|
||
<div class="projects-1">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-lg-8 mr-auto ml-auto text-center mb-5">
|
||
<h2 class="title">Some of Our Awesome Projects - 1</h2>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<nav class="navbar navbar-expand-lg bg-transparent mb-5">
|
||
<div class="container">
|
||
<div class="navbar-translate">
|
||
<p>52 projects found</p>
|
||
</div>
|
||
<ul class="navbar-nav ml-auto">
|
||
<li class="nav-item dropdown">
|
||
<a href="javascript:;" class="nav-link dropdown-toggle" id="navbarOrder" data-toggle="dropdown" aria-expanded="false">
|
||
<p>A-to-Z</p>
|
||
</a>
|
||
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarOrder">
|
||
<a class="dropdown-item" href="javascript:;">
|
||
Z-to-A
|
||
</a>
|
||
<a class="dropdown-item" href="javascript:;">
|
||
Newest
|
||
</a>
|
||
</div>
|
||
</li>
|
||
<li class="nav-item dropdown">
|
||
<a href="javascript:;" class="nav-link dropdown-toggle" id="navbarLatest" data-toggle="dropdown" aria-expanded="false">
|
||
<p>Latest</p>
|
||
</a>
|
||
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarLatest">
|
||
<a class="dropdown-item" href="javascript:;">
|
||
Newest
|
||
</a>
|
||
<a class="dropdown-item" href="javascript:;">
|
||
High interest
|
||
</a>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</nav>
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-4">
|
||
<div class="card">
|
||
<div class="card-header mt-2">
|
||
<div class="float-left">
|
||
<i class="tim-icons icon-tag d-inline text-info"></i>
|
||
<p class="d-inline">H-23</p>
|
||
</div>
|
||
<div class="float-right">
|
||
<div class="dropdown">
|
||
<button type="button" class="btn btn-link dropdown-toggle btn-icon" data-toggle="dropdown" aria-expanded="false">
|
||
<i class="tim-icons icon-settings-gear-63"></i>
|
||
</button>
|
||
<div class="dropdown-menu dropdown-menu-right" x-placement="bottom-end">
|
||
<a class="dropdown-item" href="javascript:;">Action</a>
|
||
<a class="dropdown-item" href="javascript:;">Another action</a>
|
||
<a class="dropdown-item" href="javascript:;">Something else</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="card-body text-center p-4">
|
||
<a href="javascript:;">
|
||
<img src="../../static/blk-pro/assets/img/slack.png" alt="Circle image" class="img-fluid rounded-circle shadow" style="width: 100px;">
|
||
</a>
|
||
<h4 class="card-title mb-0">Slack</h4>
|
||
<p class="card-description">We are happy to work at such a great project.</p>
|
||
<h5 class="card-title mt-4">Members</h5>
|
||
<div class="avatar-group">
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Ryan Tompson">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/james.jpg">
|
||
</a>
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Romina Hadid">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/ryan.jpg">
|
||
</a>
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Alexander Smith">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/lora.jpg">
|
||
</a>
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Jessica Doe">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/mike.jpg">
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card">
|
||
<div class="card-header mt-2">
|
||
<div class="float-left">
|
||
<i class="tim-icons icon-tag d-inline text-success"></i>
|
||
<p class="d-inline">F-43</p>
|
||
</div>
|
||
<div class="float-right">
|
||
<div class="dropdown">
|
||
<button type="button" class="btn btn-link dropdown-toggle btn-icon" data-toggle="dropdown" aria-expanded="false">
|
||
<i class="tim-icons icon-settings-gear-63"></i>
|
||
</button>
|
||
<div class="dropdown-menu dropdown-menu-right" x-placement="bottom-end">
|
||
<a class="dropdown-item" href="javascript:;">Action</a>
|
||
<a class="dropdown-item" href="javascript:;">Another action</a>
|
||
<a class="dropdown-item" href="javascript:;">Something else</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="card-body text-center p-4">
|
||
<a href="javascript:;">
|
||
<img src="../../static/blk-pro/assets/img/spotify.jpeg" alt="Circle image" class="img-fluid rounded-circle shadow" style="width: 100px;">
|
||
</a>
|
||
<h4 class="card-title mb-0">Spotify</h4>
|
||
<p class="card-description">We strive to embrace and drive change in our industry.</p>
|
||
<h5 class="card-title mt-4">Members</h5>
|
||
<div class="avatar-group">
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Ryan Tompson">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/james.jpg">
|
||
</a>
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Romina Hadid">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/ryan.jpg">
|
||
</a>
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Alexander Smith">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/lora.jpg">
|
||
</a>
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Jessica Doe">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/mike.jpg">
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card">
|
||
<div class="card-header mt-2">
|
||
<div class="float-left">
|
||
<i class="tim-icons icon-tag d-inline text-danger"></i>
|
||
<p class="d-inline">J-11</p>
|
||
</div>
|
||
<div class="float-right">
|
||
<div class="dropdown">
|
||
<button type="button" class="btn btn-link dropdown-toggle btn-icon" data-toggle="dropdown" aria-expanded="false">
|
||
<i class="tim-icons icon-settings-gear-63"></i>
|
||
</button>
|
||
<div class="dropdown-menu dropdown-menu-right" x-placement="bottom-end">
|
||
<a class="dropdown-item" href="javascript:;">Action</a>
|
||
<a class="dropdown-item" href="javascript:;">Another action</a>
|
||
<a class="dropdown-item" href="javascript:;">Something else</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="card-body text-center p-4">
|
||
<a href="javascript:;">
|
||
<img src="../../static/blk-pro/assets/img/dribbble.png" alt="Circle image" class="img-fluid rounded-circle shadow" style="width: 100px;">
|
||
</a>
|
||
<h4 class="card-title mb-0">Dribbble</h4>
|
||
<p class="card-description">The time has come to bring our plans and ideas to life.</p>
|
||
<h5 class="card-title mt-4">Members</h5>
|
||
<div class="avatar-group">
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Ryan Tompson">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/james.jpg">
|
||
</a>
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Romina Hadid">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/ryan.jpg">
|
||
</a>
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Alexander Smith">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/lora.jpg">
|
||
</a>
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Jessica Doe">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/mike.jpg">
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card">
|
||
<div class="card-header mt-2">
|
||
<div class="float-left">
|
||
<i class="tim-icons icon-tag d-inline text-warning"></i>
|
||
<p class="d-inline">A-11</p>
|
||
</div>
|
||
<div class="float-right">
|
||
<div class="dropdown">
|
||
<button type="button" class="btn btn-link dropdown-toggle btn-icon" data-toggle="dropdown" aria-expanded="false">
|
||
<i class="tim-icons icon-settings-gear-63"></i>
|
||
</button>
|
||
<div class="dropdown-menu dropdown-menu-right" x-placement="bottom-end">
|
||
<a class="dropdown-item" href="javascript:;">Action</a>
|
||
<a class="dropdown-item" href="javascript:;">Another action</a>
|
||
<a class="dropdown-item" href="javascript:;">Something else</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="card-body text-center p-4">
|
||
<a href="javascript:;">
|
||
<img src="../../static/blk-pro/assets/img/Tim.png" alt="Circle image" class="img-fluid rounded-circle shadow" style="width: 100px;">
|
||
</a>
|
||
<h4 class="card-title mb-0">CreativeTim</h4>
|
||
<p class="card-description">We are developing the best design projects. </p>
|
||
<h5 class="card-title mt-4">Members</h5>
|
||
<div class="avatar-group">
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Ryan Tompson">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/james.jpg">
|
||
</a>
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Romina Hadid">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/ryan.jpg">
|
||
</a>
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Alexander Smith">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/lora.jpg">
|
||
</a>
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Jessica Doe">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/mike.jpg">
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card">
|
||
<div class="card-header mt-2">
|
||
<div class="float-left">
|
||
<i class="tim-icons icon-tag d-inline text-primary"></i>
|
||
<p class="d-inline">A-11</p>
|
||
</div>
|
||
<div class="float-right">
|
||
<div class="dropdown">
|
||
<button type="button" class="btn btn-link dropdown-toggle btn-icon" data-toggle="dropdown" aria-expanded="false">
|
||
<i class="tim-icons icon-settings-gear-63"></i>
|
||
</button>
|
||
<div class="dropdown-menu dropdown-menu-right" x-placement="bottom-end">
|
||
<a class="dropdown-item" href="javascript:;">Action</a>
|
||
<a class="dropdown-item" href="javascript:;">Another action</a>
|
||
<a class="dropdown-item" href="javascript:;">Something else</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="card-body text-center p-4">
|
||
<a href="javascript:;">
|
||
<img src="../../static/blk-pro/assets/img/dropbox.png" alt="Circle image" class="img-fluid rounded-circle shadow" style="width: 100px;">
|
||
</a>
|
||
<h4 class="card-title mb-0">DropBox</h4>
|
||
<p class="card-description">It is important to save every project safely with our app.</p>
|
||
<h5 class="card-title mt-4">Members</h5>
|
||
<div class="avatar-group">
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Ryan Tompson">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/james.jpg">
|
||
</a>
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Romina Hadid">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/ryan.jpg">
|
||
</a>
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Alexander Smith">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/lora.jpg">
|
||
</a>
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Jessica Doe">
|
||
<img alt="Image placeholder" src="../../static/blk-pro/assets/img/mike.jpg">
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card">
|
||
<div class="card-header mt-2">
|
||
<div class="float-left">
|
||
<i class="tim-icons icon-tag d-inline"></i>
|
||
<p class="d-inline">E-28</p>
|
||
</div>
|
||
<div class="float-right">
|
||
<div class="dropdown">
|
||
<button type="button" class="btn btn-link dropdown-toggle btn-icon" data-toggle="dropdown" aria-expanded="false">
|
||
<i class="tim-icons icon-settings-gear-63"></i>
|
||
</button>
|
||
<div class="dropdown-menu dropdown-menu-right" x-placement="bottom-end">
|
||
<a class="dropdown-item" href="javascript:;">Action</a>
|
||
<a class="dropdown-item" href="javascript:;">Another action</a>
|
||
<a class="dropdown-item" href="javascript:;">Something else</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="card-body text-center p-4">
|
||
<a href="javascript:;">
|
||
<img src="../../static/blk-pro/assets/img/unass.jpg" alt="Circle image" class="img-fluid rounded-circle shadow" style="width: 100px;">
|
||
</a>
|
||
<h4 class="card-title mb-0">Unassigned</h4>
|
||
<p class="card-description">Here you can add your description and bellow add your members. </p>
|
||
<h5 class="card-title mt-4">Members</h5>
|
||
<div class="avatar-group">
|
||
<a href="javascript:;" class="avatar avatar-sm rounded-circle" data-toggle="tooltip" data-original-title="Add memberss">
|
||
<i class="tim-icons icon-lock-circle"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<footer class="mt-5">
|
||
<ul class="pagination float-left">
|
||
<li class="page-item">
|
||
<a class="page-link" href="#link" aria-label="Previous">
|
||
<span aria-hidden="true"><i class="tim-icons icon-double-left" aria-hidden="true"></i></span>
|
||
</a>
|
||
</li>
|
||
<li class="page-item active">
|
||
<a class="page-link" href="#link">1</a>
|
||
</li>
|
||
<li class="page-item">
|
||
<a class="page-link" href="#link">2</a>
|
||
</li>
|
||
<li class="page-item">
|
||
<a class="page-link" href="#link">...</a>
|
||
</li>
|
||
<li class="page-item">
|
||
<a class="page-link" href="#link">6</a>
|
||
</li>
|
||
<li class="page-item">
|
||
<a class="page-link" href="#link" aria-label="Next">
|
||
<span aria-hidden="true"><i class="tim-icons icon-double-right" aria-hidden="true"></i></span>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
<div class="text-right">
|
||
<p>Showing 6 out of 36</p>
|
||
<div>
|
||
</footer>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END PROJECTS 1 ********* -->
|
||
<!-- ********* PROJECTS 2 ********* -->
|
||
<div class="projects-2 project-raised">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-lg-8 ml-auto mr-auto text-center mb-5">
|
||
<h2 class="title">Some of Our Awesome Products - 2</h2>
|
||
<div class="section-space"></div>
|
||
</div>
|
||
</div>
|
||
<ul class="nav nav-pills nav-pills-primary nav-pills-icons nav-pills-lg" role="tablist">
|
||
<li class="nav-item m-auto">
|
||
<a class="nav-link active" data-toggle="tab" href="#project1" role="tablist">
|
||
<i class="tim-icons icon-spaceship"></i> Project 1
|
||
</a>
|
||
</li>
|
||
<li class="nav-item m-auto">
|
||
<a class="nav-link" data-toggle="tab" href="#project2" role="tablist">
|
||
<i class="tim-icons icon-bag-16"></i> Project 2
|
||
</a>
|
||
</li>
|
||
<li class="nav-item m-auto">
|
||
<a class="nav-link" data-toggle="tab" href="#project3" role="tablist">
|
||
<i class="tim-icons icon-light-3"></i> Project 3
|
||
</a>
|
||
</li>
|
||
<li class="nav-item m-auto">
|
||
<a class="nav-link" data-toggle="tab" href="#project4" role="tablist">
|
||
<i class="tim-icons icon-molecule-40"></i> Project 4
|
||
</a>
|
||
</li>
|
||
<li class="nav-item mx-auto">
|
||
<a class="nav-link" data-toggle="tab" href="#project5" role="tablist">
|
||
<i class="tim-icons icon-planet"></i> Project 5
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
<div class="tab-content tab-space">
|
||
<div class="tab-pane active" id="project1">
|
||
<div class="row mt-5">
|
||
<div class="col-md-4">
|
||
<div class="card card-blog">
|
||
<div class="card-image h-auto">
|
||
<img class="img rounded" src="http://s3.amazonaws.com/creativetim_bucket/products/38/original/opt_mk_thumbnail.jpg?1458052306s">
|
||
</div>
|
||
<div class="card-body text-left">
|
||
<div class="card-footer mt-0">
|
||
<div class="stats stats-right">
|
||
<div class="stars text-warning">
|
||
<i class="tim-icons icon-shape-star"></i>
|
||
<i class="tim-icons icon-shape-star"></i>
|
||
<i class="tim-icons icon-shape-star"></i>
|
||
<i class="tim-icons icon-shape-star"></i>
|
||
<i class="tim-icons icon-shape-star"></i>
|
||
</div>
|
||
</div>
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/Tim.png" alt="..." class="avatar img-raised">
|
||
<span>Material Kit</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card card-blog">
|
||
<div class="card-image h-auto">
|
||
<img class="img rounded" src="https://s3.amazonaws.com/creativetim_bucket/products/93/original/opt_bd_thumbnail.jpg?1535098178">
|
||
</div>
|
||
<div class="card-body text-left">
|
||
<div class="card-footer mt-0">
|
||
<div class="stats stats-right">
|
||
<i class="tim-icons icon-heart-2 text-danger"></i> 342 ·
|
||
<i class="tim-icons icon-single-copy-04 text-info"></i> 43
|
||
</div>
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/Tim.png" alt="..." class="avatar img-raised">
|
||
<span>Black Dashboard</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card card-blog">
|
||
<div class="card-image h-auto">
|
||
<img class="img rounded" src="https://s3.amazonaws.com/creativetim_bucket/products/137/original/opt_adp_thumbnail.jpg?1544778965">
|
||
</div>
|
||
<div class="card-body text-left">
|
||
<div class="card-footer mt-0">
|
||
<div class="stats stats-right">
|
||
<i class="tim-icons icon-heart-2 text-danger"></i> 127
|
||
</div>
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/Tim.png" alt="..." class="avatar img-raised">
|
||
<span>Argon Dashboard Pro</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="tab-pane" id="project2">
|
||
<div class="space-100"></div>
|
||
<div class="col-md-8 ml-auto mr-auto text-center mt-4">
|
||
<p class="description mb-5">Add your information here for Project2.</p>
|
||
</div>
|
||
<div class="space-100"></div>
|
||
</div>
|
||
<div class="tab-pane" id="project3">
|
||
<div class="space-100"></div>
|
||
<div class="col-md-8 ml-auto mr-auto text-center mt-4">
|
||
<p class="description mb-5">Add your information here for Project3.</p>
|
||
</div>
|
||
<div class="space-100"></div>
|
||
</div>
|
||
<div class="tab-pane" id="project4">
|
||
<div class="space-100"></div>
|
||
<div class="col-md-8 ml-auto mr-auto text-center mt-4">
|
||
<p class="description mb-5">Add your information here for Project4.</p>
|
||
</div>
|
||
<div class="space-100"></div>
|
||
</div>
|
||
<div class="tab-pane" id="project5">
|
||
<div class="space-100"></div>
|
||
<div class="col-md-8 ml-auto mr-auto text-center mt-4">
|
||
<p class="description mb-5">Add your information here for Project5.</p>
|
||
</div>
|
||
<div class="space-100"></div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-md-8 ml-auto mr-auto text-center mt-4">
|
||
<h3 class="title">Interested in our projects?</h3>
|
||
<h4 class="description mb-5">This is the paragraph where you can write more details about your projects. Keep you user engaged by providing meaningful information.</h4>
|
||
<button class="btn btn-primary btn-lg">Contact us</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END PROJECTS 2 ********* -->
|
||
<!-- ********* PROJECTS 3 ********* -->
|
||
<div class="projects-3">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-8 ml-auto mr-auto text-center mb-5">
|
||
<h6 class="category text-muted">Our work</h6>
|
||
<h2 class="title mt-0">Some of Our Awesome Projects - 3</h2>
|
||
</div>
|
||
</div>
|
||
<div class="space-50"></div>
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<div class="card card-blog card-plain">
|
||
<div class="card-header">
|
||
<h2 class="title">Passions</h2>
|
||
<span class="badge badge-danger">Methods</span>
|
||
<span class="badge badge-info">Purposes</span>
|
||
</div>
|
||
<div class="card-image">
|
||
<a href="javascript:;">
|
||
<img class="img rounded img-raised" src="../../static/blk-pro/assets/img/card-blog2.jpg">
|
||
</a>
|
||
</div>
|
||
<div class="card-footer text-left">
|
||
<div class="author">
|
||
<button class="btn btn-primary btn-round btn-simple"><i class="tim-icons icon-triangle-right-17"></i>View project details</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="card card-blog card-plain">
|
||
<div class="card-header">
|
||
<h2 class="title">Habits</h2>
|
||
<span class="badge badge-success">Informations</span>
|
||
</div>
|
||
<div class="card-image">
|
||
<a href="javascript:;">
|
||
<img class="img rounded img-raised" src="../../static/blk-pro/assets/img/chester-wade.jpg">
|
||
</a>
|
||
</div>
|
||
<div class="card-footer text-left">
|
||
<div class="author">
|
||
<button class="btn btn-success btn-round btn-simple">Find out more</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="space-50"></div>
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<div class="card card-blog card-plain">
|
||
<div class="card-header">
|
||
<h2 class="title">Sport</h2>
|
||
<span class="badge badge-warning">Healthy</span>
|
||
<span class="badge badge-primary">Young</span>
|
||
</div>
|
||
<div class="card-image">
|
||
<a href="javascript:;">
|
||
<img class="img rounded img-raised" src="../../static/blk-pro/assets/img/fabien-bazanegue.jpg">
|
||
</a>
|
||
</div>
|
||
<div class="card-footer text-left">
|
||
<div class="author">
|
||
<button class="btn btn-warning btn-round btn-simple">Read more</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="card card-blog card-plain">
|
||
<div class="card-header">
|
||
<h2 class="title">Nights</h2>
|
||
<span class="badge badge-success">City</span>
|
||
<span class="badge badge-info">Urban</span>
|
||
<span class="badge badge-warning">Traffic</span>
|
||
</div>
|
||
<div class="card-image">
|
||
<a href="javascript:;">
|
||
<img class="img rounded img-raised" src="../../static/blk-pro/assets/img/mark-finn.jpg">
|
||
</a>
|
||
</div>
|
||
<div class="card-footer text-left">
|
||
<div class="author">
|
||
<button class="btn btn-info btn-round btn-simple"><i class="tim-icons icon-minimal-right"></i>Go to page</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END PROJECTS 3 ********* -->
|
||
<!-- ********* PROJECTS 4 ********* -->
|
||
<div class="projects-4">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-8 mr-auto ml-auto text-center">
|
||
<h6 class="category text-muted">Our work</h6>
|
||
<h2 class="title mt-0">Some of Our Awesome Projects - 4</h2>
|
||
</div>
|
||
</div>
|
||
<div class="space-50"></div>
|
||
<div class="row">
|
||
<div class="col-lg-4">
|
||
<div class="card card-background" style="background-image: url('../../static/blk-pro/assets/img/bg8.jpg')">
|
||
<div class="card-body text-left">
|
||
<h6 class="card-category">
|
||
<i class="tim-icons icon-atom"></i>
|
||
</h6>
|
||
<a href="javascript:;">
|
||
<h1 class="card-title">Project Alpha</h1>
|
||
</a>
|
||
<h6 class="desc">Java App</h6>
|
||
<a href="javascript:;" class="btn btn-info">
|
||
Watch Later
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-4">
|
||
<div class="card card-background" style="background-image: url('../../static/blk-pro/assets/img/bg7.jpg')">
|
||
<div class="card-body text-left">
|
||
<h6 class="card-category">
|
||
<i class="tim-icons icon-camera-18"></i>
|
||
</h6>
|
||
<a href="javascript:;">
|
||
<h1 class="card-title">Project Beta</h1>
|
||
</a>
|
||
<h6 class="desc">College project</h6>
|
||
<a href="javascript:;" class="btn btn-success">
|
||
Watch Later
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-4">
|
||
<div class="card card-background" style="background-image: url('../../static/blk-pro/assets/img/bg4.jpg')">
|
||
<div class="card-body text-left">
|
||
<h6 class="card-category">
|
||
<i class="tim-icons icon-html5"></i>
|
||
</h6>
|
||
<a href="javascript:;">
|
||
<h1 class="card-title">Project Gama</h1>
|
||
</a>
|
||
<h6 class="desc">HTML code</h6>
|
||
<a href="javascript:;" class="btn btn-warning">
|
||
Watch Later
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END PROJECTS 4 ********* -->
|
||
</div>
|
||
<div class="cd-section" id="pricing">
|
||
<!-- ********* PRICING 1 ********* -->
|
||
<div class="pricing-1" id="pricing-1">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-6 ml-auto mr-auto text-center">
|
||
<h2 class="title">Pick the best plan for you</h2>
|
||
<h4 class="description ">You have Free Unlimited Updates and Premium Support on each package.</h4>
|
||
<div class="section-space"></div>
|
||
</div>
|
||
</div>
|
||
<div class="space-100"></div>
|
||
<div class="row">
|
||
<ul class="nav nav-tabs nav-tabs-primary ml-auto mb-4" role="tablist">
|
||
<li class="nav-item">
|
||
<a class="nav-link active show" data-toggle="tab" role="tablist">
|
||
Monthly
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" data-toggle="tab" role="tablist">
|
||
Yearly
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-md-4">
|
||
<div class="card card-pricing">
|
||
<div class="card-header bg-info">
|
||
<span class="badge badge-default">Starter</span>
|
||
<h1 class="card-title">
|
||
<small>$</small>22</h1>
|
||
<h5>per month</h5>
|
||
</div>
|
||
<div class="card-body">
|
||
<ul>
|
||
<li><i class="tim-icons icon-check-2"></i> 1000 MB</li>
|
||
<li><i class="tim-icons icon-email-85"></i> 3 email</li>
|
||
<li><i class="tim-icons icon-chart-bar-32"></i> 5 Databases</li>
|
||
<li><i class="tim-icons icon-alert-circle-exc"></i> No Support</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-info mt-4">
|
||
Get started
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card card-pricing">
|
||
<div class="card-header bg-danger">
|
||
<span class="badge badge-default">Pro</span>
|
||
<h1 class="card-title">
|
||
<small>$</small>45</h1>
|
||
<h5>per month</h5>
|
||
</div>
|
||
<div class="card-body">
|
||
<ul>
|
||
<li><i class="tim-icons icon-check-2"></i> 2000 MB</li>
|
||
<li><i class="tim-icons icon-email-85"></i> 100 email</li>
|
||
<li><i class="tim-icons icon-chart-bar-32"></i> 10 Databases</li>
|
||
<li><i class="tim-icons icon-alert-circle-exc"></i> Support</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-info mt-4">
|
||
Get started
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card card-pricing">
|
||
<div class="card-header bg-warning">
|
||
<span class="badge badge-default">Enterprise</span>
|
||
<h1 class="card-title">
|
||
<small>$</small>68</h1>
|
||
<h5>per month</h5>
|
||
</div>
|
||
<div class="card-body">
|
||
<ul>
|
||
<li><i class="tim-icons icon-check-2"></i> 10.000 MB</li>
|
||
<li><i class="tim-icons icon-email-85"></i> Unlimited emails</li>
|
||
<li><i class="tim-icons icon-chart-bar-32"></i> 50 Databases</li>
|
||
<li><i class="tim-icons icon-alert-circle-exc"></i> Premium Support</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-info mt-4">
|
||
Get started
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END PRICING 1 ********* -->
|
||
<!-- ********* PRICING 2 ********* -->
|
||
<div class="pricing-2" id="pricing-2">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-6 ml-auto mr-auto text-center">
|
||
<h2 class="title">Pick the best plan for you</h2>
|
||
<h4 class="description ">You have Free Unlimited Updates and Premium Support on each package.</h4>
|
||
<div class="section-space"></div>
|
||
</div>
|
||
</div>
|
||
<div class="space-100"></div>
|
||
<div class="row">
|
||
<ul class="nav nav-pills nav-pills-primary ml-auto mr-auto mb-4" role="tablist">
|
||
<li class="nav-item">
|
||
<a class="nav-link" data-toggle="tab" role="tablist">
|
||
Monthly
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link active show" data-toggle="tab" role="tablist">
|
||
Yearly
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-md-4">
|
||
<div class="card card-pricing">
|
||
<div class="card-header card-background" style="background-image: url('../../static/blk-pro/assets/img/bg8.jpg')">
|
||
<span class="badge badge-info">Starter</span>
|
||
<h1 class="card-title">
|
||
<small>$</small>199</h1>
|
||
<h5>per year</h5>
|
||
</div>
|
||
<div class="card-body">
|
||
<ul>
|
||
<li><i class="tim-icons icon-check-2"></i> 1000 MB</li>
|
||
<li><i class="tim-icons icon-email-85"></i> 3 email</li>
|
||
<li><i class="tim-icons icon-chart-bar-32"></i> 5 Databases</li>
|
||
<li><i class="tim-icons icon-alert-circle-exc"></i> No Support</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-info mt-4">
|
||
Get started
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card card-pricing">
|
||
<div class="card-header card-background" style="background-image: url('../../static/blk-pro/assets/img/bg4.jpg')">
|
||
<span class="badge badge-warning">Pro</span>
|
||
<h1 class="card-title">
|
||
<small>$</small>399</h1>
|
||
<h5>per year</h5>
|
||
</div>
|
||
<div class="card-body">
|
||
<ul>
|
||
<li><i class="tim-icons icon-check-2"></i> 2000 MB</li>
|
||
<li><i class="tim-icons icon-email-85"></i> 100 email</li>
|
||
<li><i class="tim-icons icon-chart-bar-32"></i> 10 Databases</li>
|
||
<li><i class="tim-icons icon-alert-circle-exc"></i> Support</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-warning mt-4">
|
||
Get started
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card card-pricing">
|
||
<div class="card-header card-background" style="background-image: url('../../static/blk-pro/assets/img/bg7.jpg')">
|
||
<span class="badge badge-primary">Enterprise</span>
|
||
<h1 class="card-title">
|
||
<small>$</small>599</h1>
|
||
<h5>per year</h5>
|
||
</div>
|
||
<div class="card-body">
|
||
<ul>
|
||
<li><i class="tim-icons icon-check-2"></i> 10.000 MB</li>
|
||
<li><i class="tim-icons icon-email-85"></i> Unlimited emails</li>
|
||
<li><i class="tim-icons icon-chart-bar-32"></i> 50 Databases</li>
|
||
<li><i class="tim-icons icon-alert-circle-exc"></i> Premium Support</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-primary mt-4">
|
||
Get started
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END PRICING 2 ********* -->
|
||
<!-- ********* PRICING 3 ********* -->
|
||
<div class="pricing-3" id="pricing-3">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-6 ml-auto mr-auto text-center">
|
||
<h2 class="title">Pick the best plan for you</h2>
|
||
</div>
|
||
</div>
|
||
<div class="space-50"></div>
|
||
<div class="row">
|
||
<div class="container">
|
||
<div class="card">
|
||
<div class="row">
|
||
<div class="col-md-4 pr-0">
|
||
<div class="card card-pricing card-plain">
|
||
<div class="card-header">
|
||
<h4 class="title">Team</h4>
|
||
<p class="description">All core features you need to track your expenses</p>
|
||
<h1 class="card-title">$299</h1>
|
||
<h5 class="mt-2">billed annually</h5>
|
||
</div>
|
||
<div class="card-body">
|
||
<ul>
|
||
<li><i class="tim-icons icon-check-2"></i> 1000 MB</li>
|
||
<li><i class="tim-icons icon-email-85"></i> 5 emails</li>
|
||
<li><i class="tim-icons icon-chart-bar-32"></i> 5 Databases</li>
|
||
<li><i class="tim-icons icon-alert-circle-exc"></i> No Support</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-primary mt-4">
|
||
Get started
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4 p-0">
|
||
<div class="card card-pricing card-plain">
|
||
<div class="card-header">
|
||
<h4 class="title">Growth</h4>
|
||
<p class="description">Create your perfect plan for your business or project</p>
|
||
<h1 class="card-title">$499</h1>
|
||
<h5 class="mt-2">billed annually</h5>
|
||
</div>
|
||
<div class="card-body">
|
||
<ul>
|
||
<li><i class="tim-icons icon-check-2"></i> 5000 MB</li>
|
||
<li><i class="tim-icons icon-email-85"></i> 50 emails</li>
|
||
<li><i class="tim-icons icon-chart-bar-32"></i> 10 Databases</li>
|
||
<li><i class="tim-icons icon-alert-circle-exc"></i> Premium Support</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-primary mt-4">
|
||
Get started
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4 pl-0">
|
||
<div class="card card-pricing card-plain">
|
||
<div class="card-header">
|
||
<h4 class="title">Enterprises</h4>
|
||
<p class="description">Go to the next level and add value to your customers</p>
|
||
<h1 class="card-title">$599</h1>
|
||
<h5 class="mt-2">billed annually</h5>
|
||
</div>
|
||
<div class="card-body">
|
||
<ul>
|
||
<li><i class="tim-icons icon-check-2"></i> 10.000 MB</li>
|
||
<li><i class="tim-icons icon-email-85"></i> Unlimited emails</li>
|
||
<li><i class="tim-icons icon-chart-bar-32"></i> 50 Databases</li>
|
||
<li><i class="tim-icons icon-alert-circle-exc"></i> Premium Support</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-primary mt-4">
|
||
Get started
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END PRICING 3 ********* -->
|
||
<!-- ********* PRICING 4 ********* -->
|
||
<div class="pricing-4 section-image" style="background-image: url('../../static/blk-pro/assets/img/light.jpeg')" id="pricing-4">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-6 ml-auto mr-auto text-center">
|
||
<h2 class="title">Pick the best plan for you</h2>
|
||
<h4 class="description">You have Free Unlimited Updates on each package.</h4>
|
||
<div class="section-space"></div>
|
||
</div>
|
||
</div>
|
||
<div class="space-50"></div>
|
||
<div class="row">
|
||
<div class="col-md-4">
|
||
<div class="card card-pricing card-plain">
|
||
<div class="card-body">
|
||
<h2 class="title">Free</h2>
|
||
<h5 class="description">$0.00
|
||
<small>/Monthly</small>
|
||
</h4>
|
||
<ul>
|
||
<li>1 GB of space</li>
|
||
<li>Limited Support</li>
|
||
<li>Support at $25/hour</li>
|
||
<li>Limited cloud access</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-info btn-round">
|
||
Choose plan
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card card-pricing card-plain">
|
||
<div class="card-body">
|
||
<h2 class="title">Premium
|
||
<span class="badge badge-warning">Best choice</span>
|
||
</h2>
|
||
<h5 class="description">$8.99
|
||
<small>/Monthly</small>
|
||
</h4>
|
||
<ul>
|
||
<li>5 GB of space</li>
|
||
<li>UnLimited Support</li>
|
||
<li>Unlimited Downloads</li>
|
||
<li>Full cloud access</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-info btn-round">
|
||
Choose plan
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card card-pricing card-plain">
|
||
<div class="card-body">
|
||
<h2 class="title">Exclusive</h2>
|
||
<h5 class="description">$13.99
|
||
<small>/Monthly</small>
|
||
</h4>
|
||
<ul>
|
||
<li>5 GB of space</li>
|
||
<li>UnLimited Support</li>
|
||
<li>Unlimited Downloads</li>
|
||
<li>Full cloud access</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-info btn-round">
|
||
Choose plan
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END PRICING 4 ********* -->
|
||
<!-- ********* PRICING 5 ********* -->
|
||
<div class="pricing-5" id="pricing-5">
|
||
<div class="space-50"></div>
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-6 ml-auto mr-auto text-center">
|
||
<h2 class="title">Pick the best plan for you</h2>
|
||
<h4 class="description">You have Free Unlimited Updates and Premium Support on each package.</h4>
|
||
<div class="section-space"></div>
|
||
</div>
|
||
</div>
|
||
<div class="space-50"></div>
|
||
<div class="row">
|
||
<div class="col-md-4">
|
||
<div class="card card-pricing card-plain card-primary">
|
||
<div class="card-body">
|
||
<h2 class="title">Free</h2>
|
||
<h5 class="description">$0.00
|
||
<small>/Monthly</small>
|
||
</h4>
|
||
<ul>
|
||
<li>1 GB of space</li>
|
||
<li>Limited Support</li>
|
||
<li>Support at $25/hour</li>
|
||
<li>Limited cloud access</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-info btn-round">
|
||
Choose plan
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card card-pricing card-plain card-primary">
|
||
<div class="card-body">
|
||
<h2 class="title">Premium
|
||
<span class="badge badge-warning">Best choice</span>
|
||
</h2>
|
||
<h5 class="description">$8.99
|
||
<small>/Monthly</small>
|
||
</h4>
|
||
<ul>
|
||
<li>5 GB of space</li>
|
||
<li>UnLimited Support</li>
|
||
<li>Unlimited Downloads</li>
|
||
<li>Full cloud access</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-info btn-round">
|
||
Choose plan
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="card card-pricing card-plain card-primary">
|
||
<div class="card-body">
|
||
<h2 class="title">Exclusive</h2>
|
||
<h5 class="description">$13.99
|
||
<small>/Monthly</small>
|
||
</h4>
|
||
<ul>
|
||
<li>5 GB of space</li>
|
||
<li>UnLimited Support</li>
|
||
<li>Unlimited Downloads</li>
|
||
<li>Full cloud access</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-info btn-round">
|
||
Choose plan
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END PRICING 5 ********* -->
|
||
<!-- ********* PRICING 6 ********* -->
|
||
<div class="pricing-6 section-pricing-6 section-image" id="pricing-6" style="background-image: url('../../static/blk-pro/assets/img/bg31.jpg')">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-4">
|
||
<h2 class="title">Choose a plan for your next project</h2>
|
||
<ul class="nav nav-pills nav-pills-primary" role="tablist">
|
||
<li class="nav-item">
|
||
<a class="nav-link active" data-toggle="tab" href="#personal" role="tablist">
|
||
Expensive
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a class="nav-link" data-toggle="tab" href="#commercial" role="tablist">
|
||
Cheaper
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
<p class="description">You have Free Unlimited Updates and Premium Support on each package. You also have 20 days to request a refund if you're not happy with your purchase.</p>
|
||
</div>
|
||
<div class="col-md-7 ml-auto mr-auto">
|
||
<div class="tab-content tab-space">
|
||
<div class="tab-pane active" id="personal">
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<div class="card card-pricing card-raised">
|
||
<div class="card-body">
|
||
<h6 class="category">Plus</h6>
|
||
<h1 class="card-title">
|
||
<small>$</small>100</h1>
|
||
<ul>
|
||
<li>
|
||
<b>15</b> Projects</li>
|
||
<li>
|
||
<b>5GB</b> Storage</li>
|
||
<li>
|
||
<b>Unlimited</b> users</li>
|
||
<li>
|
||
<b>No time</b> tracking</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-primary btn-round">
|
||
Buy Now!
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="card card-pricing card-plain">
|
||
<div class="card-body">
|
||
<h6 class="category">Maximum</h6>
|
||
<h1 class="card-title">
|
||
<small>$</small>120</h1>
|
||
<ul>
|
||
<li>
|
||
<b>25</b> Projects</li>
|
||
<li>
|
||
<b>15GB</b> Storage</li>
|
||
<li>
|
||
<b>Unlimited</b> users</li>
|
||
<li>
|
||
<b>No time</b> tracking</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-primary btn-round">
|
||
Buy Now!
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="tab-pane" id="commercial">
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<div class="card card-pricing card-raised">
|
||
<div class="card-body">
|
||
<h6 class="category">Standard</h6>
|
||
<h1 class="card-title">
|
||
<small>$</small>20</h1>
|
||
<ul>
|
||
<li>
|
||
<b>5</b> Projects</li>
|
||
<li>
|
||
<b>2GB</b> Storage</li>
|
||
<li>
|
||
<b>Unlimited</b> users</li>
|
||
<li>
|
||
<b>No time</b> tracking</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-primary btn-round">
|
||
Buy Now!
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="card card-pricing card-plain">
|
||
<div class="card-body">
|
||
<h6 class="category">Premium</h6>
|
||
<h1 class="card-title">
|
||
<small>$</small>60</h1>
|
||
<ul>
|
||
<li>
|
||
<b>7</b> Projects</li>
|
||
<li>
|
||
<b>3GB</b> Storage</li>
|
||
<li>
|
||
<b>Unlimited</b> users</li>
|
||
<li>
|
||
<b>No time</b> tracking</li>
|
||
</ul>
|
||
<a href="javascript:;" class="btn btn-primary btn-round">
|
||
Buy Now!
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END PRICING 6 ********* -->
|
||
</div>
|
||
<div class="cd-section" id="testimonials">
|
||
<!-- ********* TESTIMONIALS 1 ********* -->
|
||
<div class="testimonials-1">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-6 ml-auto mr-auto text-center">
|
||
<h2 class="title">What Clients Say</h2>
|
||
</div>
|
||
</div>
|
||
<div id="carousel-testimonials" class="carousel slide carousel-team">
|
||
<div class="carousel-inner">
|
||
<div class="carousel-item active">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-5 mr-auto">
|
||
<div class="space-100"></div>
|
||
<h3 class="card-title"> Isaac Hunter </h3>
|
||
<h3 class="text-warning">• • •</h3>
|
||
<h4 class="description">
|
||
Take up one idea. Make that one idea your life - think of it, dream of it, live on that idea. Let the brain, muscles, nerves, every part of your body, be full of that idea, and just leave every other idea alone. This is the way to success. A single rose can be my garden... a single friend, my world.
|
||
</h4>
|
||
<a href="javascript:void(0)" class="btn btn-warning">Read more</a>
|
||
</div>
|
||
<div class="col-md-6 ml-auto">
|
||
<img class="d-block" src="../../static/blk-pro/assets/img/lucy.jpg" alt="Second slide">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="carousel-item">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-5 mr-auto">
|
||
<div class="space-100"></div>
|
||
<h3 class="card-title"> Isaac Hunter </h3>
|
||
<h3 class="text-warning">• • •</h3>
|
||
<h4 class="description">
|
||
Take up one idea. Make that one idea your life - think of it, dream of it, live on that idea. Let the brain, muscles, nerves, every part of your body, be full of that idea, and just leave every other idea alone. This is the way to success. A single rose can be my garden... a single friend, my world.
|
||
</h4>
|
||
<a href="javascript:void(0)" class="btn btn-warning">Read more</a>
|
||
</div>
|
||
<div class="col-md-6 ml-auto">
|
||
<img class="d-block" src="../../static/blk-pro/assets/img/tom-klein.jpg" alt="First slide">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<a class="carousel-control-prev" href="#carousel-testimonials" role="button" data-slide="prev">
|
||
<i class="tim-icons icon-minimal-left"></i>
|
||
<span class="sr-only">Previous</span>
|
||
</a>
|
||
<a class="carousel-control-next" href="#carousel-testimonials" role="button" data-slide="next">
|
||
<i class="tim-icons icon-minimal-right"></i>
|
||
<span class="sr-only">Next</span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END TESTIMONIALS 1 ********* -->
|
||
<!-- ********* TESTIMONIALS 2 ********* -->
|
||
<div class="testimonials-2">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-12">
|
||
<div id="carouselExampleIndicators2" class="carousel slide">
|
||
<ol class="carousel-indicators">
|
||
<li data-target="#carouselExampleIndicators2" data-slide-to="0" class="active"></li>
|
||
<li data-target="#carouselExampleIndicators2" data-slide-to="1"></li>
|
||
</ol>
|
||
<div class="carousel-inner" role="listbox">
|
||
<div class="carousel-item active justify-content-center">
|
||
<div class="info info-primary">
|
||
<div class="card-avatar">
|
||
<a href="javascript:;">
|
||
<img class="img img-raised rounded" src="../../static/blk-pro/assets/img/michael.jpg">
|
||
</a>
|
||
</div>
|
||
<h4 class="info-title">Best Quality</h4>
|
||
<p class="description">Gain access to the demographics, psychographics, and location of unique people.</p>
|
||
</div>
|
||
</div>
|
||
<div class="carousel-item justify-content-center">
|
||
<div class="info info-warning">
|
||
<div class="card-avatar">
|
||
<a href="javascript:;">
|
||
<img class="img img-raised rounded" src="../../static/blk-pro/assets/img/olivia.jpg">
|
||
</a>
|
||
</div>
|
||
<h4 class="info-title">Best Quality</h4>
|
||
<p class="description">Gain access to the demographics, psychographics, and location of unique people.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<a class="carousel-control-prev" href="#carouselExampleIndicators2" role="button" data-slide="prev">
|
||
<i class="tim-icons icon-minimal-left"></i>
|
||
</a>
|
||
<a class="carousel-control-next" href="#carouselExampleIndicators2" role="button" data-slide="next">
|
||
<i class="tim-icons icon-minimal-right"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END TESTIMONIALS 2 ********* -->
|
||
<!-- ********* TESTIMONIALS 3 ********* -->
|
||
<div class="testimonials-3">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-6 ml-auto mr-auto text-center">
|
||
<h2 class="title">What Clients Say</h2>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div id="carousel-testimonials3" class="carousel slide carousel-team">
|
||
<div class="carousel-inner">
|
||
<div class="carousel-item active">
|
||
<div class="info text-left bg-danger">
|
||
<div class="icon icon-white">
|
||
<i class="fa fa-quote-right"></i>
|
||
</div>
|
||
<p class="description text-white">
|
||
Take up one idea. Make that one idea your life - think of it, dream of it, live on that idea. Let the brain, muscles, nerves, every part of your body, be full of that idea, and just leave every other idea alone. This is the way to success. A single rose can be my garden... a single friend, my world.
|
||
</p>
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/p10.jpg" alt="..." class="avatar img-raised">
|
||
<span>Mike John</span>
|
||
</div>
|
||
</div>
|
||
<div class="card card-blog card-background" data-animation="true">
|
||
<div class="full-background" style="background-image: url('../../static/blk-pro/assets/img/marc-olivier-jodoin.jpg')"></div>
|
||
<div class="card-body">
|
||
<div class="content-bottom ml-auto">
|
||
<a href="javascript:void(0)" class="btn btn-round btn-simple btn-neutral">Read more</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="carousel-item">
|
||
<div class="info text-left bg-info">
|
||
<div class="icon icon-white">
|
||
<i class="fa fa-quote-right"></i>
|
||
</div>
|
||
<p class="description text-white">
|
||
Take up one idea. Make that one idea your life - think of it, dream of it, live on that idea. Let the brain, muscles, nerves, every part of your body, be full of that idea, and just leave every other idea alone. This is the way to success. A single rose can be my garden... a single friend, my world.
|
||
</p>
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/olivia.jpg" alt="..." class="avatar img-raised">
|
||
<span>Andrew Lino</span>
|
||
</div>
|
||
</div>
|
||
<div class="card card-blog card-background" data-animation="true">
|
||
<div class="full-background" style="background-image: url('../../static/blk-pro/assets/img/contact1.jpg')"></div>
|
||
<div class="card-body">
|
||
<div class="content-bottom ml-auto">
|
||
<a href="javascript:void(0)" class="btn btn-round btn-simple btn-neutral">Read more</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END TESTIMONIALS 3 ********* -->
|
||
<!-- ********* TESTIMONIALS 4 ********* -->
|
||
<div class="testimonials-4">
|
||
<div class="container-fluid">
|
||
<div class="row">
|
||
<div class="col-md-6 ml-auto mr-auto text-center">
|
||
<h2 class="title">Join our world</h2>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-lg-4 col-md-8 col-10 positioned">
|
||
<h1 class="title">See our customers opinion</h1>
|
||
<p class="description text-white">
|
||
Meet Wingman, a robust suite of styled pages and components, powered by Bootstrap 4. The ideal starting point for product landing pages, stylish web-apps and complete company websites.
|
||
</p>
|
||
<a href="javascript:;" class="btn btn-lg btn-info">Contact us</a>
|
||
</div>
|
||
<div class="col-md-12 col-md-6">
|
||
<section class="center slider">
|
||
<div>
|
||
<div class="info text-left">
|
||
<p class="description text-white">
|
||
"Take up one idea. Make that one idea your life - think of it, dream of it, live on that idea. Let the brain, muscles, nerves, every part of your body, be full of that idea, and just leave every other idea alone. This is the way to success. A single rose can be my garden... a single friend, my world."
|
||
</p>
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/olivia.jpg" alt="..." class="avatar img-raised">
|
||
<span>Andrew Lino</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div>
|
||
<div class="info text-left">
|
||
<p class="description text-white">
|
||
Artist is a term applied to a person who engages in an activity deemed to be an art. An artist also may be defined unofficially as "a person who expresses him- or herself through a medium". He is a descriptive term applied to a person who engages in an activity deemed to be an art."
|
||
</p>
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/james.jpg" alt="..." class="avatar img-raised">
|
||
<span>Michael Jenos</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div>
|
||
<div class="info text-left">
|
||
<p class="description text-white">
|
||
"The simplest visual description uses ordinary words to convey what the writer sees. First he or she must look at the subject – slowly, carefully, and repeatedly, if possible – to identify the parts that make the whole"
|
||
</p>
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/ryan.jpg" alt="..." class="avatar img-raised">
|
||
<span>Rose Arthur</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div>
|
||
<div class="info text-left">
|
||
<p class="description text-white">
|
||
"Finding temporary housing for your dog should be as easy as renting an Airbnb. That’s the idea behind Rover, which raised $65 million to expand its pet sitting and dog-walking businesses..Finding temporary housing for your dog should be as easy as renting an Airbnb."
|
||
</p>
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/lora.jpg" alt="..." class="avatar img-raised">
|
||
<span>Lora Jimi</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div>
|
||
<div class="info text-left">
|
||
<p class="description text-white">
|
||
"Venture investment in U.S. startups rose sequentially in the second quarter of 2017, boosted by large, late-stage financings and a few outsized early-stage rounds in tech and healthcare..enture investment in U.S. startups rose sequentially in the second quarter of 2017, boosted by large."
|
||
</p>
|
||
<div class="author">
|
||
<img src="../../static/blk-pro/assets/img/mike.jpg" alt="..." class="avatar img-raised">
|
||
<span>Mike Ranson</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END TESTIMONIALS 4 ********* -->
|
||
</div>
|
||
<div class="cd-section" id="contactus">
|
||
<!-- ********* CONTACT US 1 ********* -->
|
||
<div class="contactus-1 section-image" style="background-image: url('../../static/blk-pro/assets/img/contact1.jpg')">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-5">
|
||
<h2 class="title">Get in Touch</h2>
|
||
<h4 class="description">You need more information? Check what other persons are saying about our product. They are very happy with their purchase.</h4>
|
||
<div class="info info-horizontal">
|
||
<div class="icon icon-primary">
|
||
<i class="tim-icons icon-square-pin"></i>
|
||
</div>
|
||
<div class="description">
|
||
<h4 class="info-title">Find us at the office</h4>
|
||
<p class="description"> Bld Mihail Kogalniceanu, nr. 8,
|
||
<br> 7652 Bucharest,
|
||
<br> Romania
|
||
</p>
|
||
</div>
|
||
</div>
|
||
<div class="info info-horizontal">
|
||
<div class="icon icon-primary">
|
||
<i class="tim-icons icon-mobile"></i>
|
||
</div>
|
||
<div class="description">
|
||
<h4 class="info-title">Give us a ring</h4>
|
||
<p class="description"> Michael Jordan
|
||
<br> +40 762 321 762
|
||
<br> Mon - Fri, 8:00-22:00
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-5 ml-auto mr-auto">
|
||
<div class="card card-contact card-raised">
|
||
<form role="form" id="contact-form" method="post">
|
||
<div class="card-header text-center">
|
||
<h4 class="card-title">Contact Us</h4>
|
||
</div>
|
||
<div class="card-body">
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<label>First name</label>
|
||
<div class="input-group">
|
||
<div class="input-group-prepend">
|
||
<span class="input-group-text"><i class="tim-icons icon-single-02"></i></span>
|
||
</div>
|
||
<input type="text" class="form-control" placeholder="First Name..." aria-label="First Name...">
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6 pl-2">
|
||
<div class="form-group">
|
||
<label>Last name</label>
|
||
<div class="input-group">
|
||
<div class="input-group-prepend">
|
||
<span class="input-group-text"><i class="tim-icons icon-caps-small"></i></span>
|
||
</div>
|
||
<input type="text" class="form-control" placeholder="Last Name..." aria-label="Last Name...">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label>Email address</label>
|
||
<div class="input-group">
|
||
<div class="input-group-prepend">
|
||
<span class="input-group-text"><i class="tim-icons icon-email-85"></i></span>
|
||
</div>
|
||
<input type="text" class="form-control" placeholder="Email Here...">
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label>Your message</label>
|
||
<textarea name="message" class="form-control" id="message" rows="6"></textarea>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<div class="form-check">
|
||
<label class="form-check-label">
|
||
<input class="form-check-input" type="checkbox">
|
||
<span class="form-check-sign"></span>
|
||
I'm not a robot
|
||
</label>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<button type="submit" class="btn btn-primary btn-round pull-right">Send Message</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END CONTACT US 1 ********* -->
|
||
<!-- ********* CONTACT US 2 ********* -->
|
||
<div class="contactus-2">
|
||
<div id="contactUsMap" class="map"></div>
|
||
<div class="col-lg-6 col-md-10">
|
||
<div class="card card-contact card-raised">
|
||
<form role="form" id="contact-form" method="post">
|
||
<div class="card-header text-center">
|
||
<h4 class="card-title">Contact Us</h4>
|
||
</div>
|
||
<div class="card-body">
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<div class="info info-horizontal">
|
||
<div class="icon icon-primary">
|
||
<i class="tim-icons icon-mobile"></i>
|
||
</div>
|
||
<div class="description">
|
||
<h5 class="info-title">Give us a ring</h5>
|
||
<p> Michael Jordan
|
||
<br> +40 762 321 762
|
||
<br> Mon - Fri, 8:00-22:00
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="info info-horizontal">
|
||
<div class="icon icon-primary">
|
||
<i class="tim-icons icon-square-pin"></i>
|
||
</div>
|
||
<div class="description">
|
||
<h5 class="info-title">Find us at the office</h5>
|
||
<p> Mihail Kogalniceanu, nr. 8,
|
||
<br> 7652 Bucharest,
|
||
<br> Romania
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<label>Full name</label>
|
||
<div class="input-group">
|
||
<div class="input-group-prepend">
|
||
<span class="input-group-text"><i class="tim-icons icon-single-02"></i></span>
|
||
</div>
|
||
<input type="text" class="form-control" placeholder="First Name..." autocomplete="given-name">
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<label>Email address</label>
|
||
<div class="input-group">
|
||
<div class="input-group-prepend">
|
||
<span class="input-group-text"><i class="tim-icons icon-email-85"></i></span>
|
||
</div>
|
||
<input type="email" class="form-control" placeholder="Email Here..." autocomplete="email">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row mt-3">
|
||
<div class="col-md-6">
|
||
<div class="form-check">
|
||
<label class="form-check-label">
|
||
<input class="form-check-input" type="checkbox">
|
||
<span class="form-check-sign"></span>
|
||
I'm not a robot
|
||
</label>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<button type="submit" class="btn btn-primary btn-round pull-right">Send Message</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END CONTACT US 2 ********* -->
|
||
<!-- ********* CONTACT US 3 ********* -->
|
||
<div class="contactus-3">
|
||
<div class="page-header header-filter">
|
||
<div class="page-header-image" style="background-image: url('../../static/blk-pro/assets/img/andre-benz.jpg');"></div>
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-12 text-center">
|
||
<h1 class="title">Got a question?</h1>
|
||
<h3>We'd like to talk more about what you need</h3>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-lg-3">
|
||
<div class="info info-hover">
|
||
<div class="icon icon-primary">
|
||
<img class="bg-blob" src="../../static/blk-pro/assets/img/feature-blob/primary.png">
|
||
<i class="tim-icons icon-square-pin"></i>
|
||
</div>
|
||
<h4 class="info-title">Address</h4>
|
||
<p class="description">12124 First Street, nr 54</p>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-3">
|
||
<div class="info info-hover">
|
||
<div class="icon icon-info">
|
||
<img class="bg-blob" src="../../static/blk-pro/assets/img/feature-blob/info.png">
|
||
<i class="tim-icons icon-email-85"></i>
|
||
</div>
|
||
<h4 class="info-title">Email</h4>
|
||
<p class="description">support@youremail.com</p>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-3">
|
||
<div class="info info-hover">
|
||
<div class="icon icon-warning">
|
||
<img class="bg-blob" src="../../static/blk-pro/assets/img/feature-blob/warning.png">
|
||
<i class="tim-icons icon-mobile"></i>
|
||
</div>
|
||
<h4 class="info-title">Phone Number</h4>
|
||
<p class="description">+1(424) 535 3523</p>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-3">
|
||
<div class="info info-hover">
|
||
<div class="icon icon-success">
|
||
<img class="bg-blob" src="../../static/blk-pro/assets/img/feature-blob/success.png">
|
||
<i class="tim-icons icon-single-02"></i>
|
||
</div>
|
||
<h4 class="info-title">Contact</h4>
|
||
<p class="description">Andrew Samian</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END CONTACT US 3 ********* -->
|
||
<!-- ********* CONTACT US 4 ********* -->
|
||
<div class="contactus-4">
|
||
<div id="contactUs2Map" class="map"></div>
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-5">
|
||
<h1 class="title">Get in Touch</h1>
|
||
<h4 class="description text-white">Do you need more information? Please contact us to find more about our products and services.</h4>
|
||
</div>
|
||
<div class="col-md-12 m-auto">
|
||
<div class="card card-contact card-raised">
|
||
<div class="row">
|
||
<div class="col-md-8">
|
||
<form role="form" class="p-3" id="contact-form" method="post">
|
||
<div class="card-header">
|
||
<h4 class="card-title">Send us a message</h4>
|
||
</div>
|
||
<div class="card-body">
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<label>First name</label>
|
||
<div class="input-group">
|
||
<div class="input-group-prepend">
|
||
<span class="input-group-text"><i class="tim-icons icon-single-02"></i></span>
|
||
</div>
|
||
<input type="text" class="form-control" placeholder="First Name..." aria-label="First Name...">
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<div class="form-group">
|
||
<label>Last name</label>
|
||
<div class="input-group">
|
||
<div class="input-group-prepend">
|
||
<span class="input-group-text"><i class="tim-icons icon-caps-small"></i></span>
|
||
</div>
|
||
<input type="text" class="form-control" placeholder="Last Name..." aria-label="Last Name...">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label>Email address</label>
|
||
<div class="input-group">
|
||
<div class="input-group-prepend">
|
||
<span class="input-group-text"><i class="tim-icons icon-email-85"></i></span>
|
||
</div>
|
||
<input type="text" class="form-control" placeholder="Email Here...">
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label>Your message</label>
|
||
<textarea name="message" class="form-control" id="message" rows="6"></textarea>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-md-6">
|
||
<div class="form-check">
|
||
<label class="form-check-label">
|
||
<input class="form-check-input" type="checkbox">
|
||
<span class="form-check-sign"></span>
|
||
I'm not a robot
|
||
</label>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<button type="submit" class="btn btn-primary btn-round pull-right">Send Message</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
<div class="col-md-4">
|
||
<div class="info text-left bg-info">
|
||
<h4 class="card-title">Contact information</h4>
|
||
<div class="info info-horizontal mt-5">
|
||
<div class="icon">
|
||
<i class="tim-icons icon-square-pin"></i>
|
||
</div>
|
||
<div class="description">
|
||
<h5 class="info-title">
|
||
345 Street 2
|
||
<br> Creative Tim Tour
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
<div class="info info-horizontal">
|
||
<div class="icon">
|
||
<i class="tim-icons icon-mobile"></i>
|
||
</div>
|
||
<div class="description">
|
||
<h5 class="info-title">
|
||
+16(3412) 421 241
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
<div class="info info-horizontal">
|
||
<div class="icon">
|
||
<i class="tim-icons icon-email-85"></i>
|
||
</div>
|
||
<div class="description">
|
||
<h5 class="info-title">
|
||
contact@yourwebsite.com
|
||
</h5>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END CONTACT US 4 ********* -->
|
||
</div>
|
||
<div class="cd-section" id="tables">
|
||
<!-- ********* Table 1 ********* -->
|
||
<div class="tables-1">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-6 ml-auto mr-auto text-center">
|
||
<h2 class="title mb-4">Find out more details</h2>
|
||
<div class="section-space"></div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-md-12 mx-auto">
|
||
<div>
|
||
<div class="card card-plain">
|
||
<div class="card-body">
|
||
<div class="table-responsive">
|
||
<table class="table table-pricing">
|
||
<thead class="text-primary">
|
||
<tr>
|
||
<th>
|
||
<h3 class="mb-0">Space individual</h3>
|
||
</th>
|
||
<th>
|
||
<h6>Team</h6>
|
||
<h4 class="desc"> $39/mo</h4>
|
||
<a href="javascript:void(0)" class="btn btn-success btn-sm btn-simple">Choose Plan</a>
|
||
</th>
|
||
<th>
|
||
<h6>Growth</h6>
|
||
<h4 class="desc"> $79/mo</h4>
|
||
<a href="javascript:void(0)" class="btn btn-success btn-sm">Choose Plan</a>
|
||
</th>
|
||
<th>
|
||
<h6>Enterprise</h6>
|
||
<h4 class="desc"> $99/mo</h4>
|
||
<a href="javascript:void(0)" class="btn btn-success btn-sm">Choose Plan</a>
|
||
</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td>
|
||
Community support <i class="tim-icons icon-alert-circle-exc"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-check-2 text-success"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-check-2 text-success"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-check-2 text-success"></i>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>
|
||
100+ Example Pages
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-check-2 text-success"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-check-2 text-success"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-check-2 text-success"></i>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>
|
||
50+ Section Examples
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-check-2 text-success"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-check-2 text-success"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-check-2 text-success"></i>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>
|
||
Multiple use
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-simple-remove"></i>
|
||
</td>
|
||
<td>
|
||
upon request
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-check-2 text-success"></i>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>
|
||
Custom messages
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-check-2 text-success"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-simple-remove"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-simple-remove"></i>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>
|
||
Multiple requests
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-simple-remove"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-simple-remove"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-simple-remove"></i>
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END Table 1 ********* -->
|
||
<!-- ********* Table 2 ********* -->
|
||
<div class="tables-2">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-6 ml-auto mr-auto text-center">
|
||
<h2 class="title mb-4">The best solution you can choose</h2>
|
||
<div class="section-space"></div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-md-12 mx-auto">
|
||
<div>
|
||
<div class="card">
|
||
<div class="card-body">
|
||
<div class="table-responsive mb-0">
|
||
<table class="table table-pricing">
|
||
<thead class="text-primary">
|
||
<tr>
|
||
<th class="p-5">
|
||
<img src="../../static/blk-pro/assets/img/bg4.png" class="background">
|
||
<img src="../../static/blk-pro/assets/img/man-up.png" class="man">
|
||
<img src="../../static/blk-pro/assets/img/girl-up.png" class="girl">
|
||
</th>
|
||
<th class="text-center">
|
||
<h3 class="card-title">FindMe</h3>
|
||
<h5 class="desc"> Quick and easy online crowdfunding</h5>
|
||
<a href="javascript:void(0)" class="btn btn-info btn-sm">Get started</a>
|
||
<a href="javascript:void(0)">Learn more</a>
|
||
</th>
|
||
<th class="text-center">
|
||
<h3 class="card-title">Essential</h3>
|
||
<h5 class="desc"> All the basic components to make your work easier</h5>
|
||
<a href="javascript:void(0)" class="btn btn-info btn-sm">Get started</a>
|
||
<a href="javascript:void(0)">Learn more</a>
|
||
</th>
|
||
<th class="text-center">
|
||
<h3 class="card-title">Premium</h3>
|
||
<h5 class="desc"> Everything you need to break the rulesmof success</h5>
|
||
<a href="javascript:void(0)" class="btn btn-info btn-sm">Get started</a>
|
||
<a href="javascript:void(0)">Learn more</a>
|
||
</th>
|
||
<th class="text-center">
|
||
<h3 class="card-title">Enterprise</h3>
|
||
<h5 class="desc"> Advanced option to get the best version of you</h5>
|
||
<a href="javascript:void(0)" class="btn btn-info btn-sm">Get started</a>
|
||
<a href="javascript:void(0)">Learn more</a>
|
||
</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr class="bg-primary">
|
||
<td class="text-white">
|
||
<b>Pricing</b>
|
||
</td>
|
||
<td>
|
||
</td>
|
||
<td>
|
||
</td>
|
||
<td>
|
||
</td>
|
||
<td>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>
|
||
Plan cost<i class="tim-icons icon-alert-circle-exc ml-1"></i>
|
||
</td>
|
||
<td>
|
||
Free
|
||
</td>
|
||
<td>
|
||
Free
|
||
</td>
|
||
<td>
|
||
<a href="javascript:void(0)">Contact us</a>
|
||
</td>
|
||
<td>
|
||
<a href="javascript:void(0)">Contact us</a>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>
|
||
Platform fee<i class="tim-icons icon-alert-circle-exc ml-1"></i>
|
||
</td>
|
||
<td>
|
||
0%
|
||
</td>
|
||
<td>
|
||
3%
|
||
</td>
|
||
<td>
|
||
5%
|
||
</td>
|
||
<td>
|
||
<a href="javascript:void(0)">Contact us</a>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>
|
||
Payment processing
|
||
</td>
|
||
<td>
|
||
4% + 5c
|
||
</td>
|
||
<td>
|
||
5.5% + 5c
|
||
</td>
|
||
<td>
|
||
6.2% + 5c
|
||
</td>
|
||
<td>
|
||
<a href="javascript:void(0)">Contact us</a>
|
||
</td>
|
||
</tr>
|
||
<tr class="bg-primary">
|
||
<td class="text-white">
|
||
<b>Features</b>
|
||
</td>
|
||
<td>
|
||
</td>
|
||
<td>
|
||
</td>
|
||
<td>
|
||
</td>
|
||
<td>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>
|
||
Custom messages
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-check-2 text-success"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-simple-remove text-danger"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-simple-remove text-danger"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-simple-remove text-danger"></i>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>
|
||
Multiple requests
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-simple-remove text-danger"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-simple-remove text-danger"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-simple-remove text-danger"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-simple-remove text-danger"></i>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>
|
||
Team fundraising
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-check-2 text-success"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-check-2 text-success"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-check-2 text-success"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-check-2 text-success"></i>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<td>
|
||
Basic donor data
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-check-2 text-success"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-check-2 text-success"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-simple-remove text-danger"></i>
|
||
</td>
|
||
<td>
|
||
<i class="tim-icons icon-simple-remove text-danger"></i>
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END Table 2 ********* -->
|
||
</div>
|
||
<div class="cd-section" id="accordion">
|
||
<!-- ********* Accordion 1 ********* -->
|
||
<div class="accordion-1">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-6 ml-auto mr-auto text-center">
|
||
<h2 class="title mb-4 mt-5">Frequently asked question</h2>
|
||
<div class="section-space"></div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-md-12 ml-auto">
|
||
<div class="accordion" id="accordionExample">
|
||
<div class="card">
|
||
<div class="card-header" id="headingOne">
|
||
<h5 class="mb-0">
|
||
<button class="btn btn-link w-100 text-left" type="button" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
|
||
How do I order?
|
||
<i class="tim-icons icon-minimal-down float-right"></i>
|
||
</button>
|
||
</h5>
|
||
</div>
|
||
<div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordionExample">
|
||
<div class="card-body">
|
||
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="card">
|
||
<div class="card-header" id="headingTwo">
|
||
<h5 class="mb-0">
|
||
<button class="btn btn-link w-100 text-left collapsed" type="button" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
|
||
How can i make the payment?
|
||
<i class="tim-icons icon-minimal-down float-right"></i>
|
||
</button>
|
||
</h5>
|
||
</div>
|
||
<div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordionExample">
|
||
<div class="card-body">
|
||
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="card">
|
||
<div class="card-header" id="headingThree">
|
||
<h5 class="mb-0">
|
||
<button class="btn btn-link w-100 text-left collapsed" type="button" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
|
||
How much time does it take to receive the order?
|
||
<i class="tim-icons icon-minimal-down float-right"></i>
|
||
</button>
|
||
</h5>
|
||
</div>
|
||
<div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordionExample">
|
||
<div class="card-body">
|
||
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="card">
|
||
<div class="card-header" id="headingFour">
|
||
<h5 class="mb-0">
|
||
<button class="btn btn-link w-100 text-left" type="button" data-toggle="collapse" data-target="#collapseFour" aria-controls="collapseFour">
|
||
Can I resell the products?
|
||
<i class="tim-icons icon-minimal-down float-right"></i>
|
||
</button>
|
||
</h5>
|
||
</div>
|
||
<div id="collapseFour" class="collapse" aria-labelledby="headingFour" data-parent="#accordionExample">
|
||
<div class="card-body">
|
||
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="card">
|
||
<div class="card-header" id="headingFifth">
|
||
<h5 class="mb-0">
|
||
<button class="btn btn-link w-100 text-left" type="button" data-toggle="collapse" data-target="#collapseFifth" aria-controls="collapseFifth">
|
||
Where do I find the shipping details?
|
||
<i class="tim-icons icon-minimal-down float-right"></i>
|
||
</button>
|
||
</h5>
|
||
</div>
|
||
<div id="collapseFifth" class="collapse" aria-labelledby="headingFifth" data-parent="#accordionExample">
|
||
<div class="card-body">
|
||
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- ********* END Accordion 1 ********* -->
|
||
</div>
|
||
<footer class="footer">
|
||
<div class="container">
|
||
<div class="row">
|
||
<div class="col-md-3">
|
||
<h1 class="title">BLK•</h1>
|
||
</div>
|
||
<div class="col-md-3 col-6">
|
||
<ul class="nav">
|
||
<li class="nav-item">
|
||
<a href="./index.html" class="nav-link">
|
||
Home
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a href="./examples/landing-page.html" class="nav-link">
|
||
Landing
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a href="./examples/register-page.html" class="nav-link">
|
||
Register
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a href="./examples/profile-page.html" class="nav-link">
|
||
Profile
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div class="col-md-3 col-6">
|
||
<ul class="nav">
|
||
<li class="nav-item">
|
||
<a href="https://creative-tim.com/contact-us?ref=blkdsp-footer" class="nav-link">
|
||
Contact Us
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a href="https://creative-tim.com/about-us?ref=blkdsp-footer" class="nav-link">
|
||
About Us
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a href="http://creative-tim.com/blog?ref=blkdsp-footer" class="nav-link">
|
||
Blog
|
||
</a>
|
||
</li>
|
||
<li class="nav-item">
|
||
<a href="https://opensource.org/licenses/MIT?ref=blkdsp-footer" class="nav-link">
|
||
License
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div class="col-md-3">
|
||
<h3 class="title">Follow us:</h3>
|
||
<div class="btn-wrapper profile text-left">
|
||
<a target="_blank" href="https://twitter.com/creativetim" class="btn btn-icon btn-neutral btn-round btn-simple" data-toggle="tooltip" data-original-title="Follow us">
|
||
<i class="fab fa-twitter"></i>
|
||
</a>
|
||
<a target="_blank" href="https://www.facebook.com/creativetim" class="btn btn-icon btn-neutral btn-round btn-simple" data-toggle="tooltip" data-original-title="Like us">
|
||
<i class="fab fa-facebook-square"></i>
|
||
</a>
|
||
<a target="_blank" href="https://dribbble.com/creativetim" class="btn btn-icon btn-neutral btn-round btn-simple" data-toggle="tooltip" data-original-title="Follow us">
|
||
<i class="fab fa-dribbble"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
</div>
|
||
<!-- Core JS Files -->
|
||
<script src="../../static/blk-pro/assets/js/core/jquery.min.js" type="text/javascript"></script>
|
||
<script src="../../static/blk-pro/assets/js/core/popper.min.js" type="text/javascript"></script>
|
||
<script src="../../static/blk-pro/assets/js/core/bootstrap.min.js" type="text/javascript"></script>
|
||
<script src="../../static/blk-pro/assets/js/plugins/perfect-scrollbar.jquery.min.js"></script>
|
||
<!-- Plugin for Switches, full documentation here: http://www.jque.re/plugins/version3/bootstrap.switch/ -->
|
||
<script src="../../static/blk-pro/assets/js/plugins/bootstrap-switch.js"></script>
|
||
<!-- Plugin for the Sliders, full documentation here: http://refreshless.com/nouislider/ -->
|
||
<script src="../../static/blk-pro/assets/js/plugins/nouislider.min.js" type="text/javascript"></script>
|
||
<!-- Plugin for the Carousel, full documentation here: http://kenwheeler.github.io/slick/ -->
|
||
<script src="../../static/blk-pro/assets/js/plugins/slick.js" type="text/javascript"></script>
|
||
<!-- Plugin for the blob animation -->
|
||
<script src="../../static/blk-pro/assets/js/plugins/anime.min.js" type="text/javascript"></script>
|
||
<!-- Chart JS -->
|
||
<script src="../../static/blk-pro/assets/js/plugins/chartjs.min.js"></script>
|
||
<!-- Plugin for the DatePicker, full documentation here: https://github.com/uxsolutions/bootstrap-datepicker -->
|
||
<script src="../../static/blk-pro/assets/js/plugins/moment.min.js"></script>
|
||
<!-- Plugin for Tags, full documentation here: https://github.com/bootstrap-tagsinput/bootstrap-tagsinputs -->
|
||
<script src="../../static/blk-pro/assets/js/plugins/bootstrap-tagsinput.js"></script>
|
||
<!-- Plugin for Select, full documentation here: http://silviomoreto.github.io/bootstrap-select -->
|
||
<script src="../../static/blk-pro/assets/js/plugins/bootstrap-selectpicker.js" type="text/javascript"></script>
|
||
<!-- Plugin for the DateTimePicker, full documentation here: https://eonasdan.github.io/bootstrap-datetimepicker/ -->
|
||
<script src="../../static/blk-pro/assets/js/plugins/bootstrap-datetimepicker.js" type="text/javascript"></script>
|
||
<!-- Plugin for Fileupload, full documentation here: http://www.jasny.net/bootstrap/javascript/#fileinput -->
|
||
<script src="../../static/blk-pro/assets/js/plugins/jasny-bootstrap.min.js"></script>
|
||
<!-- Black Dashboard DEMO methods, don't include it in your project! -->
|
||
<script src="../../static/blk-pro/assets/demo/demo.js"></script>
|
||
<!-- Control Center for Black UI Kit: parallax effects, scripts for the example pages etc -->
|
||
<!-- Google Maps Plugin -->
|
||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script>
|
||
<script src="../../static/blk-pro/assets/js/blk-design-system-pro.min.js?v=1.0.0" type="text/javascript"></script>
|
||
<script>
|
||
$(document).ready(function() {
|
||
|
||
// Video Background
|
||
blackKit.initVideoBackground();
|
||
blackKit.initContactUsMap();
|
||
blackKit.initContactUs2Map();
|
||
|
||
// Activate Navbar
|
||
if ($('.nav-down').length != 0) {
|
||
blackKit.checkScrollForMovingNavbar();
|
||
};
|
||
|
||
// Carousel
|
||
|
||
$(".center").slick({
|
||
dots: false,
|
||
infinite: true,
|
||
centerMode: true,
|
||
slidesToShow: 4,
|
||
slidesToScroll: 1,
|
||
responsive: [{
|
||
breakpoint: 1024,
|
||
settings: {
|
||
slidesToShow: 3,
|
||
slidesToScroll: 1,
|
||
infinite: true,
|
||
}
|
||
},
|
||
{
|
||
breakpoint: 600,
|
||
settings: {
|
||
slidesToShow: 2,
|
||
slidesToScroll: 1
|
||
}
|
||
},
|
||
{
|
||
breakpoint: 480,
|
||
settings: {
|
||
slidesToShow: 1,
|
||
slidesToScroll: 1
|
||
}
|
||
}
|
||
// You can unslick at a given breakpoint now by adding:
|
||
// settings: "unslick"
|
||
// instead of a settings object
|
||
]
|
||
});
|
||
|
||
// Logo Carousel
|
||
|
||
$('.customer-logos').slick({
|
||
slidesToShow: 6,
|
||
slidesToScroll: 1,
|
||
autoplay: true,
|
||
autoplaySpeed: 2500,
|
||
arrows: false,
|
||
dots: false,
|
||
pauseOnHover: false,
|
||
responsive: [{
|
||
breakpoint: 768,
|
||
settings: {
|
||
slidesToShow: 4
|
||
}
|
||
},
|
||
{
|
||
breakpoint: 520,
|
||
settings: {
|
||
slidesToShow: 3
|
||
}
|
||
},
|
||
{
|
||
breakpoint: 480,
|
||
settings: {
|
||
slidesToShow: 1,
|
||
slidesToScroll: 1
|
||
}
|
||
}
|
||
]
|
||
});
|
||
|
||
/**
|
||
* main.js
|
||
* http://www.codrops.com
|
||
*
|
||
* Licensed under the MIT license.
|
||
* http://www.opensource.org/licenses/mit-license.php
|
||
*
|
||
* Copyright 2017, Codrops
|
||
* http://www.codrops.com
|
||
*/
|
||
{
|
||
class ImgItem {
|
||
constructor(el) {
|
||
this.DOM = {};
|
||
this.DOM.el = el;
|
||
this.DOM.svg = this.DOM.el.querySelector('.item__svg');
|
||
this.DOM.path = this.DOM.svg.querySelector('path');
|
||
this.paths = {};
|
||
this.paths.start = this.DOM.path.getAttribute('d');
|
||
this.paths.end = this.DOM.el.dataset.morphPath;
|
||
this.DOM.deco = this.DOM.svg.querySelector('.item__deco');
|
||
this.DOM.image = this.DOM.svg.querySelector('image');
|
||
this.DOM.title = this.DOM.el.querySelector('.item__meta > .item__title');
|
||
this.DOM.subtitle = this.DOM.el.querySelector('.item__meta > .item__subtitle');
|
||
this.CONFIG = {
|
||
// Defaults:
|
||
animation: {
|
||
path: {
|
||
duration: this.DOM.el.dataset.animationPathDuration || 1500,
|
||
delay: this.DOM.el.dataset.animationPathDelay || 0,
|
||
easing: this.DOM.el.dataset.animationPathEasing || 'easeOutElastic',
|
||
elasticity: this.DOM.el.dataset.pathElasticity || 400,
|
||
scaleX: this.DOM.el.dataset.pathScalex || 1,
|
||
scaleY: this.DOM.el.dataset.pathScaley || 1,
|
||
translateX: this.DOM.el.dataset.pathTranslatex || 0,
|
||
translateY: this.DOM.el.dataset.pathTranslatey || 0,
|
||
rotate: this.DOM.el.dataset.pathRotate || 0
|
||
},
|
||
image: {
|
||
duration: this.DOM.el.dataset.animationImageDuration || 2000,
|
||
delay: this.DOM.el.dataset.animationImageDelay || 0,
|
||
easing: this.DOM.el.dataset.animationImageEasing || 'easeOutElastic',
|
||
elasticity: this.DOM.el.dataset.imageElasticity || 400,
|
||
scaleX: this.DOM.el.dataset.imageScalex || 1.1,
|
||
scaleY: this.DOM.el.dataset.imageScaley || 1.1,
|
||
translateX: this.DOM.el.dataset.imageTranslatex || 0,
|
||
translateY: this.DOM.el.dataset.imageTranslatey || 0,
|
||
rotate: this.DOM.el.dataset.imageRotate || 0
|
||
},
|
||
deco: {
|
||
duration: this.DOM.el.dataset.animationDecoDuration || 2500,
|
||
delay: this.DOM.el.dataset.animationDecoDelay || 0,
|
||
easing: this.DOM.el.dataset.animationDecoEasing || 'easeOutQuad',
|
||
elasticity: this.DOM.el.dataset.decoElasticity || 400,
|
||
scaleX: this.DOM.el.dataset.decoScalex || 0.9,
|
||
scaleY: this.DOM.el.dataset.decoScaley || 0.9,
|
||
translateX: this.DOM.el.dataset.decoTranslatex || 0,
|
||
translateY: this.DOM.el.dataset.decoTranslatey || 0,
|
||
rotate: this.DOM.el.dataset.decoRotate || 0
|
||
}
|
||
}
|
||
};
|
||
this.initEvents();
|
||
}
|
||
initEvents() {
|
||
this.mouseenterFn = () => {
|
||
this.mouseTimeout = setTimeout(() => {
|
||
this.isActive = true;
|
||
this.animate();
|
||
}, 75);
|
||
}
|
||
this.mouseleaveFn = () => {
|
||
clearTimeout(this.mouseTimeout);
|
||
if (this.isActive) {
|
||
this.isActive = false;
|
||
this.animate();
|
||
}
|
||
}
|
||
this.DOM.el.addEventListener('mouseenter', this.mouseenterFn);
|
||
this.DOM.el.addEventListener('mouseleave', this.mouseleaveFn);
|
||
this.DOM.el.addEventListener('touchstart', this.mouseenterFn);
|
||
this.DOM.el.addEventListener('touchend', this.mouseleaveFn);
|
||
}
|
||
getAnimeObj(targetStr) {
|
||
const target = this.DOM[targetStr];
|
||
let animeOpts = {
|
||
targets: target,
|
||
duration: this.CONFIG.animation[targetStr].duration,
|
||
delay: this.CONFIG.animation[targetStr].delay,
|
||
easing: this.CONFIG.animation[targetStr].easing,
|
||
elasticity: this.CONFIG.animation[targetStr].elasticity,
|
||
scaleX: this.isActive ? this.CONFIG.animation[targetStr].scaleX : 1,
|
||
scaleY: this.isActive ? this.CONFIG.animation[targetStr].scaleY : 1,
|
||
translateX: this.isActive ? this.CONFIG.animation[targetStr].translateX : 0,
|
||
translateY: this.isActive ? this.CONFIG.animation[targetStr].translateY : 0,
|
||
rotate: this.isActive ? this.CONFIG.animation[targetStr].rotate : 0
|
||
};
|
||
if (targetStr === 'path') {
|
||
animeOpts.d = this.isActive ? this.paths.end : this.paths.start;
|
||
}
|
||
anime.remove(target);
|
||
return animeOpts;
|
||
}
|
||
animate() {
|
||
// Animate the path, the image and deco.
|
||
anime(this.getAnimeObj('path'));
|
||
anime(this.getAnimeObj('image'));
|
||
anime(this.getAnimeObj('deco'));
|
||
// Title and Subtitle animation
|
||
anime.remove(this.DOM.title);
|
||
anime({
|
||
targets: this.DOM.title,
|
||
easing: 'easeOutQuad',
|
||
translateY: this.isActive ? [{
|
||
value: '-50%',
|
||
duration: 200
|
||
},
|
||
{
|
||
value: ['50%', '0%'],
|
||
duration: 200
|
||
}
|
||
] : [{
|
||
value: '50%',
|
||
duration: 200
|
||
},
|
||
{
|
||
value: ['-50%', '0%'],
|
||
duration: 200
|
||
}
|
||
],
|
||
opacity: [{
|
||
value: 0,
|
||
duration: 200
|
||
},
|
||
{
|
||
value: 1,
|
||
duration: 200
|
||
}
|
||
]
|
||
});
|
||
anime.remove(this.DOM.subtitle);
|
||
anime({
|
||
targets: this.DOM.subtitle,
|
||
easing: 'easeOutQuad',
|
||
translateY: this.isActive ? {
|
||
value: ['50%', '0%'],
|
||
duration: 200,
|
||
delay: 250
|
||
} : {
|
||
value: '0%',
|
||
duration: 1
|
||
},
|
||
opacity: this.isActive ? {
|
||
value: [0, 1],
|
||
duration: 200,
|
||
delay: 250
|
||
} : {
|
||
value: 0,
|
||
duration: 1
|
||
}
|
||
});
|
||
}
|
||
}
|
||
|
||
const items = Array.from(document.querySelectorAll('.item'));
|
||
const init = (() => items.forEach(item => new ImgItem(item)))();
|
||
setTimeout(() => document.body.classList.remove('loading'), 2000);
|
||
};
|
||
|
||
});
|
||
</script>
|
||
<script src="https://cdn.trackjs.com/agent/v3/latest/t.js"></script>
|
||
<script>
|
||
window.TrackJS &&
|
||
TrackJS.install({
|
||
token: "ee6fab19c5a04ac1a32a645abde4613a",
|
||
application: "black-dashboard-pro"
|
||
});
|
||
</script>
|
||
</body>
|
||
|
||
</html>
|