Chiefsoft/WrenchCoinWebsite
1
0
Fork 0
Code Issues Pull Requests Releases Activity
Files
master
WrenchCoinWebsite/sandbox310/src/demo9.html
T
dev-chiefworks b085356c99 first commit
2022-09-25 15:25:10 -04:00

581 lines
30 KiB
HTML
Raw Permalink Blame History

<!DOCTYPE html>
<html lang="en">
<head>
@@include('_head.html')
<link rel="preload" href="@@webRoot/assets/css/fonts/dm.css" as="style" onload="this.rel='stylesheet'">
</head>
<body>
<div class="content-wrapper">
<header class="wrapper bg-soft-primary">
@@include('_navbar.html', {
"classList": "classic transparent navbar-light",
"otherClassList": "ms-lg-4",
"otherBtn": true,
"otherBtnClassList": "btn-sm btn-primary rounded-pill",
"otherBtnText": "Sign In",
"otherBtnLink": "#modal-signin",
"otherBtnModal": true,
"otherInfo": true
})
</header>
<!-- /header -->
<section class="wrapper bg-soft-primary">
<div class="container pt-10 pb-12 pt-md-14 pb-md-17">
<div class="row gx-lg-8 gx-xl-12 gy-10 align-items-center">
<div class="col-md-10 offset-md-1 offset-lg-0 col-lg-5 mt-lg-n2 text-center text-lg-start order-2 order-lg-0" data-cues="slideInDown" data-group="page-title" data-delay="600">
<h1 class="display-1 mb-5 mx-md-10 mx-lg-0">Sandbox is effortless and powerful with <br /><span class="typer text-primary text-nowrap" data-delay="100" data-words="easy usage,fast transactions,secure payments"></span><span class="cursor text-primary" data-owner="typer"></span></h1>
<p class="lead fs-lg mb-7">Achieve your saving goals. Have all your recurring and one time expenses and incomes in one place.</p>
<div class="d-flex justify-content-center justify-content-lg-start" data-cues="slideInDown" data-group="page-title-buttons" data-delay="900">
<span><a class="btn btn-lg btn-primary rounded me-2">Get Started</a></span>
<span><a class="btn btn-lg btn-green rounded">Free Trial</a></span>
</div>
</div>
<!-- /column -->
<div class="col-lg-7">
<div class="row">
<div class="col-3 offset-1 offset-lg-0 col-lg-4 d-flex flex-column" data-cues="zoomIn" data-group="col-start" data-delay="300">
<div class="ms-auto mt-auto"><img class="img-fluid rounded shadow-lg" src="@@webRoot/assets/img/photos/sa20.jpg" srcset="@@webRoot/assets/img/photos/sa20@2x.jpg 2x" alt="" /></div>
<div class="ms-auto mt-5 mb-10"><img class="img-fluid rounded shadow-lg" src="@@webRoot/assets/img/photos/sa18.jpg" srcset="@@webRoot/assets/img/photos/sa18@2x.jpg 2x" alt="" /></div>
</div>
<!-- /column -->
<div class="col-4 col-lg-5" data-cue="zoomIn">
<div><img class="w-100 img-fluid rounded shadow-lg" src="@@webRoot/assets/img/photos/sa16.jpg" srcset="@@webRoot/assets/img/photos/sa16@2x.jpg 2x" alt="" /></div>
</div>
<!-- /column -->
<div class="col-3 d-flex flex-column" data-cues="zoomIn" data-group="col-end" data-delay="300">
<div class="mt-auto"><img class="img-fluid rounded shadow-lg" src="@@webRoot/assets/img/photos/sa21.jpg" srcset="@@webRoot/assets/img/photos/sa21@2x.jpg 2x" alt="" /></div>
<div class="mt-5"><img class="img-fluid rounded shadow-lg" src="@@webRoot/assets/img/photos/sa19.jpg" srcset="@@webRoot/assets/img/photos/sa19@2x.jpg 2x" alt="" /></div>
<div class="mt-5 mb-10"><img class="img-fluid rounded shadow-lg" src="@@webRoot/assets/img/photos/sa17.jpg" srcset="@@webRoot/assets/img/photos/sa17@2x.jpg 2x" alt="" /></div>
</div>
<!-- /column -->
</div>
<!-- /.row -->
</div>
<!-- /column -->
</div>
<!-- /.row -->
</div>
<!-- /.container -->
</section>
<!-- /section -->
<section class="wrapper bg-light">
<div class="container py-14 pt-md-17 pb-md-25">
<h2 class="fs-15 text-uppercase text-muted text-center mb-8">Trusted by Over 5000 Clients</h2>
<div class="px-lg-5 mb-14 mb-md-19">
<div class="row gx-0 gx-md-8 gx-xl-12 gy-8 align-items-center">
<div class="col-4 col-md-2">
<figure class="px-5 px-md-0 px-lg-2 px-xl-3 px-xxl-4"><img src="@@webRoot/assets/img/brands/c1.png" alt="" /></figure>
</div>
<!--/column -->
<div class="col-4 col-md-2">
<figure class="px-5 px-md-0 px-lg-2 px-xl-3 px-xxl-4"><img src="@@webRoot/assets/img/brands/c2.png" alt="" /></figure>
</div>
<!--/column -->
<div class="col-4 col-md-2">
<figure class="px-5 px-md-0 px-lg-2 px-xl-3 px-xxl-4"><img src="@@webRoot/assets/img/brands/c3.png" alt="" /></figure>
</div>
<!--/column -->
<div class="col-4 col-md-2">
<figure class="px-5 px-md-0 px-lg-2 px-xl-3 px-xxl-4"><img src="@@webRoot/assets/img/brands/c4.png" alt="" /></figure>
</div>
<!--/column -->
<div class="col-4 col-md-2">
<figure class="px-5 px-md-0 px-lg-2 px-xl-3 px-xxl-4"><img src="@@webRoot/assets/img/brands/c5.png" alt="" /></figure>
</div>
<!--/column -->
<div class="col-4 col-md-2">
<figure class="px-5 px-md-0 px-lg-2 px-xl-3 px-xxl-4"><img src="@@webRoot/assets/img/brands/c6.png" alt="" /></figure>
</div>
<!--/column -->
</div>
<!--/.row -->
</div>
<!-- /div -->
<div class="row">
<div class="col-md-10 offset-md-1 col-lg-8 offset-lg-2 mx-auto text-center">
<h2 class="fs-15 text-uppercase text-muted mb-3">Why Choose Sandbox?</h2>
<h3 class="display-4 mb-10 px-xl-10 px-xxl-15">Here are a few reasons why our customers choose Sandbox.</h3>
</div>
<!-- /column -->
</div>
<!-- /.row -->
<ul class="nav nav-tabs nav-tabs-bg nav-tabs-shadow-lg d-flex justify-content-between nav-justified flex-lg-row flex-column">
<li class="nav-item"> <a class="nav-link d-flex flex-row active" data-bs-toggle="tab" href="#tab2-1">
<div><img src="@@webRoot/assets/img/icons/lineal/rocket.svg" class="svg-inject icon-svg icon-svg-md text-yellow me-4" alt="" /></div>
<div>
<h4 class="mb-1">Easy Usage</h4>
<p>Duis mollis commodo luctus cursus commodo tortor mauris.</p>
</div>
</a> </li>
<li class="nav-item"> <a class="nav-link d-flex flex-row" data-bs-toggle="tab" href="#tab2-2">
<div><img src="@@webRoot/assets/img/icons/lineal/savings.svg" class="svg-inject icon-svg icon-svg-md text-green me-4" alt="" /></div>
<div>
<h4 class="mb-1">Fast Transactions</h4>
<p>Vivamus sagittis lacus augue fusce dapibus tellus nibh.</p>
</div>
</a> </li>
<li class="nav-item"> <a class="nav-link d-flex flex-row" data-bs-toggle="tab" href="#tab2-3">
<div><img src="@@webRoot/assets/img/icons/lineal/shield.svg" class="svg-inject icon-svg icon-svg-md text-red me-4" alt="" /></div>
<div>
<h4 class="mb-1">Secure Payments</h4>
<p>Vestibulum ligula porta felis maecenas faucibus mollis.</p>
</div>
</a> </li>
</ul>
<!-- /.nav-tabs -->
<div class="tab-content mt-6 mt-lg-8 mb-md-9">
<div class="tab-pane fade show active" id="tab2-1">
<div class="row gx-lg-8 gx-xl-12 gy-10 align-items-center">
<div class="col-lg-6">
<div class="row gx-md-5 gy-5 align-items-center">
<div class="col-6">
<img class="img-fluid rounded shadow-lg d-flex ms-auto" src="@@webRoot/assets/img/photos/sa13.jpg" srcset="@@webRoot/assets/img/photos/sa13@2x.jpg 2x" alt="" />
</div>
<!-- /column -->
<div class="col-6">
<img class="img-fluid rounded shadow-lg mb-5" src="@@webRoot/assets/img/photos/sa14.jpg" srcset="@@webRoot/assets/img/photos/sa14@2x.jpg 2x" alt="" />
<img class="img-fluid rounded shadow-lg d-flex col-10" src="@@webRoot/assets/img/photos/sa15.jpg" srcset="@@webRoot/assets/img/photos/sa15@2x.jpg 2x" alt="" />
</div>
<!-- /column -->
</div>
<!-- /.row -->
</div>
<!--/column -->
<div class="col-lg-6">
<h2 class="mb-3">Easy Usage</h2>
<p>Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auctor fringilla. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Nullam quis risus eget urna.</p>
<ul class="icon-list bullet-bg bullet-soft-yellow">
<li><i class="uil uil-check"></i>Aenean eu leo quam. Pellentesque ornare.</li>
<li><i class="uil uil-check"></i>Nullam quis risus eget urna mollis ornare.</li>
<li><i class="uil uil-check"></i>Donec id elit non mi porta gravida at eget.</li>
</ul>
<a href="#" class="btn btn-yellow mt-2">Learn More</a>
</div>
<!--/column -->
</div>
<!--/.row -->
</div>
<!--/.tab-pane -->
<div class="tab-pane fade" id="tab2-2">
<div class="row gx-lg-8 gx-xl-12 gy-10 align-items-center">
<div class="col-lg-6 order-lg-2">
<div class="row gx-md-5 gy-5">
<div class="col-5">
<img class="img-fluid rounded shadow-lg my-5 d-flex ms-auto" src="@@webRoot/assets/img/photos/sa9.jpg" srcset="@@webRoot/assets/img/photos/sa9@2x.jpg 2x" alt="" />
<img class="img-fluid rounded shadow-lg d-flex col-10 ms-auto" src="@@webRoot/assets/img/photos/sa10.jpg" srcset="@@webRoot/assets/img/photos/sa10@2x.jpg 2x" alt="" />
</div>
<!-- /column -->
<div class="col-7">
<img class="img-fluid rounded shadow-lg mb-5" src="@@webRoot/assets/img/photos/sa11.jpg" srcset="@@webRoot/assets/img/photos/sa11@2x.jpg 2x" alt="" />
<img class="img-fluid rounded shadow-lg d-flex col-11" src="@@webRoot/assets/img/photos/sa12.jpg" srcset="@@webRoot/assets/img/photos/sa12@2x.jpg 2x" alt="" />
</div>
<!-- /column -->
</div>
<!-- /.row -->
</div>
<!--/column -->
<div class="col-lg-6">
<h2 class="mb-3">Fast Transactions</h2>
<p>Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auctor fringilla. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Nullam quis risus eget urna.</p>
<ul class="icon-list bullet-bg bullet-soft-green">
<li><i class="uil uil-check"></i>Aenean eu leo quam. Pellentesque ornare.</li>
<li><i class="uil uil-check"></i>Nullam quis risus eget urna mollis ornare.</li>
<li><i class="uil uil-check"></i>Donec id elit non mi porta gravida at eget.</li>
</ul>
<a href="#" class="btn btn-green mt-2">Learn More</a>
</div>
<!--/column -->
</div>
<!--/.row -->
</div>
<!--/.tab-pane -->
<div class="tab-pane fade" id="tab2-3">
<div class="row gx-lg-8 gx-xl-12 gy-10 align-items-center">
<div class="col-lg-6">
<div class="row gx-md-5 gy-5">
<div class="col-6">
<img class="img-fluid rounded shadow-lg mb-5" src="@@webRoot/assets/img/photos/sa5.jpg" srcset="@@webRoot/assets/img/photos/sa5@2x.jpg 2x" alt="" />
<img class="img-fluid rounded shadow-lg d-flex col-10 ms-auto" src="@@webRoot/assets/img/photos/sa6.jpg" srcset="@@webRoot/assets/img/photos/sa6@2x.jpg 2x" alt="" />
</div>
<!-- /column -->
<div class="col-6">
<img class="img-fluid rounded shadow-lg my-5" src="@@webRoot/assets/img/photos/sa7.jpg" srcset="@@webRoot/assets/img/photos/sa7@2x.jpg 2x" alt="" />
<img class="img-fluid rounded shadow-lg d-flex col-10" src="@@webRoot/assets/img/photos/sa8.jpg" srcset="@@webRoot/assets/img/photos/sa8@2x.jpg 2x" alt="" />
</div>
<!-- /column -->
</div>
<!-- /.row -->
</div>
<!--/column -->
<div class="col-lg-6">
<h2 class="mb-3">Secure Payments</h2>
<p>Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auctor fringilla. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Nullam quis risus eget urna.</p>
<ul class="icon-list bullet-bg bullet-soft-red">
<li><i class="uil uil-check"></i>Aenean eu leo quam. Pellentesque ornare.</li>
<li><i class="uil uil-check"></i>Nullam quis risus eget urna mollis ornare.</li>
<li><i class="uil uil-check"></i>Donec id elit non mi porta gravida at eget.</li>
</ul>
<a href="#" class="btn btn-red mt-2">Learn More</a>
</div>
<!--/column -->
</div>
<!--/.row -->
</div>
<!--/.tab-pane -->
</div>
<!-- /.tab-content -->
</div>
<!-- /.container -->
</section>
<!-- /section -->
<section class="wrapper bg-soft-primary">
<div class="container py-14 py-md-17">
<div class="row mt-md-n25">
<div class="col-md-10 offset-md-1 col-lg-8 offset-lg-2 mx-auto text-center">
<h2 class="fs-15 text-uppercase text-muted mb-3">Happy Customers</h2>
<h3 class="display-4 mb-10 px-xl-10 px-xxl-15">Don't take our word for it. See what customers are saying about us.</h3>
</div>
<!-- /column -->
</div>
<!-- /.row -->
<div class="grid">
<div class="row isotope gy-6">
<div class="item col-md-6 col-xl-4">
<div class="card shadow-lg">
<div class="card-body">
<span class="ratings five mb-3"></span>
<blockquote class="icon mb-0">
<p>“Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Vestibulum id ligula porta felis euismod semper. Cras justo odio dapibus facilisis sociis natoque penatibus.”</p>
<div class="blockquote-details">
<img class="rounded-circle w-12" src="@@webRoot/assets/img/avatars/te1.jpg" srcset="@@webRoot/assets/img/avatars/te1@2x.jpg 2x" alt="" />
<div class="info">
<h5 class="mb-1">Coriss Ambady</h5>
<p class="mb-0">Financial Analyst</p>
</div>
</div>
</blockquote>
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!--/column -->
<div class="item col-md-6 col-xl-4">
<div class="card shadow-lg">
<div class="card-body">
<span class="ratings five mb-3"></span>
<blockquote class="icon mb-0">
<p>“Fusce dapibus, tellus ac cursus tortor mauris condimentum fermentum massa justo sit amet. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Cras mattis consectetur purus sit amet fermentum. Aenean lacinia bibendum nulla sed consectetur.”</p>
<div class="blockquote-details">
<img class="rounded-circle w-12" src="@@webRoot/assets/img/avatars/te2.jpg" srcset="@@webRoot/assets/img/avatars/te2@2x.jpg 2x" alt="" />
<div class="info">
<h5 class="mb-1">Cory Zamora</h5>
<p class="mb-0">Marketing Specialist</p>
</div>
</div>
</blockquote>
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!--/column -->
<div class="item col-md-6 col-xl-4">
<div class="card shadow-lg">
<div class="card-body">
<span class="ratings five mb-3"></span>
<blockquote class="icon mb-0">
<p>“Curabitur blandit tempus porttitor. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Nullam quis risus eget porta ac consectetur vestibulum. Donec sed odio dui consectetur adipiscing elit.”</p>
<div class="blockquote-details">
<img class="rounded-circle w-12" src="@@webRoot/assets/img/avatars/te3.jpg" srcset="@@webRoot/assets/img/avatars/te3@2x.jpg 2x" alt="" />
<div class="info">
<h5 class="mb-1">Nikolas Brooten</h5>
<p class="mb-0">Sales Manager</p>
</div>
</div>
</blockquote>
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!--/column -->
<div class="item col-md-6 col-xl-4">
<div class="card shadow-lg">
<div class="card-body">
<span class="ratings five mb-3"></span>
<blockquote class="icon mb-0">
<p>“Etiam adipiscing tincidunt elit convallis felis suscipit ut. Phasellus rhoncus tincidunt auctor. Nullam eu sagittis mauris. Donec non dolor ac elit aliquam tincidunt at at sapien. Aenean tortor libero condimentum ac laoreet vitae.”</p>
<div class="blockquote-details">
<img class="rounded-circle w-12" src="@@webRoot/assets/img/avatars/te4.jpg" srcset="@@webRoot/assets/img/avatars/te4@2x.jpg 2x" alt="" />
<div class="info">
<h5 class="mb-1">Coriss Ambady</h5>
<p class="mb-0">Financial Analyst</p>
</div>
</div>
</blockquote>
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!--/column -->
<div class="item col-md-6 col-xl-4">
<div class="card shadow-lg">
<div class="card-body">
<span class="ratings five mb-3"></span>
<blockquote class="icon mb-0">
<p>“Maecenas sed diam eget risus varius blandit sit amet non magna. Cum sociis natoque penatibus magnis dis montes, nascetur ridiculus mus. Donec sed odio dui. Nulla vitae elit libero a pharetra.”</p>
<div class="blockquote-details">
<img class="rounded-circle w-12" src="@@webRoot/assets/img/avatars/te5.jpg" srcset="@@webRoot/assets/img/avatars/te5@2x.jpg 2x" alt="" />
<div class="info">
<h5 class="mb-1">Jackie Sanders</h5>
<p class="mb-0">Investment Planner</p>
</div>
</div>
</blockquote>
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!--/column -->
<div class="item col-md-6 col-xl-4">
<div class="card shadow-lg">
<div class="card-body">
<span class="ratings five mb-3"></span>
<blockquote class="icon mb-0">
<p>“Donec id elit non mi porta gravida at eget metus. Nulla vitae elit libero, a pharetra augue. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.”</p>
<div class="blockquote-details">
<img class="rounded-circle w-12" src="@@webRoot/assets/img/avatars/te6.jpg" srcset="@@webRoot/assets/img/avatars/te6@2x.jpg 2x" alt="" />
<div class="info">
<h5 class="mb-1">Laura Widerski</h5>
<p class="mb-0">Sales Specialist</p>
</div>
</div>
</blockquote>
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!--/column -->
</div>
<!-- /.row -->
</div>
<!-- /.grid-view -->
</div>
<!-- /.container -->
</section>
<!-- /section -->
<section class="wrapper bg-light">
<div class="container py-14 py-md-17">
<div class="row gy-10 gy-sm-13 gx-lg-3 align-items-center mb-14 mb-md-19">
<div class="col-md-8 col-lg-6 position-relative">
<a href="@@webRoot/assets/media/movie.mp4" class="btn btn-circle btn-primary btn-play ripple mx-auto mb-5 position-absolute" style="top:50%; left: 50%; transform: translate(-50%,-50%); z-index:3;" data-glightbox><i class="icn-caret-right"></i></a>
<div class="shape rounded bg-soft-primary rellax d-md-block" data-rellax-speed="0" style="bottom: -1.8rem; right: -1.5rem; width: 85%; height: 90%; "></div>
<figure class="rounded"><img src="@@webRoot/assets/img/photos/about8.jpg" srcset="@@webRoot/assets/img/photos/about8@2x.jpg 2x" alt=""></figure>
</div>
<!--/column -->
<div class="col-lg-5 col-xl-4 offset-lg-1">
<h2 class="fs-15 text-uppercase text-muted mb-3">How It Works?</h2>
<h3 class="display-4 mb-7">Here are the 3 working steps on success.</h3>
<div class="d-flex flex-row mb-5">
<div>
<img src="@@webRoot/assets/img/icons/lineal/shield.svg" class="svg-inject icon-svg icon-svg-md text-yellow me-5" alt="" />
</div>
<div>
<h4 class="mb-1">Secured Transactions</h4>
<p class="mb-0">Nulla vitae elit libero pharetra augue dapibus. Praesent commodo cursus.</p>
</div>
</div>
<div class="d-flex flex-row mb-5">
<div>
<img src="@@webRoot/assets/img/icons/lineal/savings.svg" class="svg-inject icon-svg icon-svg-md text-green me-5" alt="" />
</div>
<div>
<h4 class="mb-1">Bills Planning</h4>
<p class="mb-0">Vivamus sagittis lacus vel augue laoreet. Etiam porta sem malesuada magna.</p>
</div>
</div>
<div class="d-flex flex-row">
<div>
<img src="@@webRoot/assets/img/icons/lineal/loading.svg" class="svg-inject icon-svg icon-svg-md text-red me-5" alt="" />
</div>
<div>
<h4 class="mb-1">Always up to date</h4>
<p class="mb-0">Cras mattis consectetur purus sit amet. Aenean lacinia bibendum nulla sed.</p>
</div>
</div>
</div>
<!--/column -->
</div>
<!--/.row -->
<div class="row gy-6 align-items-center">
<div class="col-lg-4">
<h2 class="fs-15 text-uppercase text-muted mb-3">Our Pricing</h2>
<h3 class="display-4 mb-5">We offer great and premium prices.</h3>
<p class="mb-5">Enjoy a <a href="#" class="hover">free 30-day trial</a> and experience the full service. No credit card required!</p>
<a href="#" class="btn btn-primary rounded mt-2">See All Prices</a>
</div>
<!--/column -->
<div class="col-lg-7 offset-lg-1 pricing-wrapper">
<div class="pricing-switcher-wrapper switcher justify-content-start justify-content-lg-end">
<p class="mb-0 pe-3">Monthly</p>
<div class="pricing-switchers">
<div class="pricing-switcher pricing-switcher-active"></div>
<div class="pricing-switcher"></div>
<div class="switcher-button bg-primary"></div>
</div>
<p class="mb-0 ps-3">Yearly <span class="text-red">(Save 30%)</span></p>
</div>
<div class="row gy-6 mt-5">
<div class="col-md-6">
<div class="pricing card shadow-lg">
<div class="card-body pb-12">
<div class="prices text-dark">
<div class="price price-show"><span class="price-currency">$</span><span class="price-value">19</span> <span class="price-duration">month</span></div>
<div class="price price-hide price-hidden"><span class="price-currency">$</span><span class="price-value">199</span> <span class="price-duration">year</span></div>
</div>
<!--/.prices -->
<h4 class="card-title mt-2">Premium Plan</h4>
<ul class="icon-list bullet-bg bullet-soft-primary mt-8 mb-9">
<li><i class="uil uil-check"></i><span><strong>5</strong> Projects </span></li>
<li><i class="uil uil-check"></i><span><strong>100K</strong> API Access </span></li>
<li><i class="uil uil-check"></i><span><strong>200MB</strong> Storage </span></li>
<li><i class="uil uil-check"></i><span> Weekly <strong>Reports</strong></span></li>
<li><i class="uil uil-times bullet-soft-red"></i><span> 7/24 <strong>Support</strong></span></li>
</ul>
<a href="#" class="btn btn-primary rounded">Choose Plan</a>
</div>
<!--/.card-body -->
</div>
<!--/.pricing -->
</div>
<!--/column -->
<div class="col-md-6 popular">
<div class="pricing card shadow-lg">
<div class="card-body pb-12">
<div class="prices text-dark">
<div class="price price-show"><span class="price-currency">$</span><span class="price-value">49</span> <span class="price-duration">month</span></div>
<div class="price price-hide price-hidden"><span class="price-currency">$</span><span class="price-value">499</span> <span class="price-duration">year</span></div>
</div>
<!--/.prices -->
<h4 class="card-title mt-2">Corporate Plan</h4>
<ul class="icon-list bullet-bg bullet-soft-primary mt-8 mb-9">
<li><i class="uil uil-check"></i><span><strong>20</strong> Projects </span></li>
<li><i class="uil uil-check"></i><span><strong>300K</strong> API Access </span></li>
<li><i class="uil uil-check"></i><span><strong>500MB</strong> Storage </span></li>
<li><i class="uil uil-check"></i><span> Weekly <strong>Reports</strong></span></li>
<li><i class="uil uil-check"></i><span> 7/24 <strong>Support</strong></span></li>
</ul>
<a href="#" class="btn btn-primary rounded">Choose Plan</a>
</div>
<!--/.card-body -->
</div>
<!--/.pricing -->
</div>
<!--/column -->
</div>
<!--/.row -->
</div>
<!--/column -->
</div>
<!--/.row -->
</div>
<!-- /.container -->
</section>
<!-- /section -->
<section class="wrapper bg-soft-primary">
<div class="container py-14 py-md-17">
<div class="row">
<div class="col-lg-11 col-xxl-10 mx-auto text-center">
<h2 class="fs-15 text-uppercase text-muted mb-3">FAQ</h2>
<h3 class="display-4 mb-10 px-lg-12 px-xl-10 px-xxl-15">If you don't see an answer to your question, you can send us an email from our contact form.</h3>
</div>
<!--/column -->
</div>
<!--/.row -->
<div class="row">
<div class="col-lg-7 mx-auto">
<div id="accordion-3" class="accordion-wrapper">
<div class="card accordion-item shadow-lg">
<div class="card-header" id="accordion-heading-3-1">
<button class="collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-1" aria-expanded="false" aria-controls="accordion-collapse-3-1">How do I get my subscription receipt?</button>
</div>
<!-- /.card-header -->
<div id="accordion-collapse-3-1" class="collapse" aria-labelledby="accordion-heading-3-1" data-bs-target="#accordion-3">
<div class="card-body">
<p>Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec sed odio dui. Cras justo odio, dapibus ac facilisis.</p>
</div>
<!-- /.card-body -->
</div>
<!-- /.collapse -->
</div>
<!-- /.card -->
<div class="card accordion-item shadow-lg">
<div class="card-header" id="accordion-heading-3-2">
<button class="collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-2" aria-expanded="false" aria-controls="accordion-collapse-3-2">Are there any discounts for people in need?</button>
</div>
<!-- /.card-header -->
<div id="accordion-collapse-3-2" class="collapse" aria-labelledby="accordion-heading-3-2" data-bs-target="#accordion-3">
<div class="card-body">
<p>Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec sed odio dui. Cras justo odio, dapibus ac facilisis.</p>
</div>
<!-- /.card-body -->
</div>
<!-- /.collapse -->
</div>
<!-- /.card -->
<div class="card accordion-item shadow-lg">
<div class="card-header" id="accordion-heading-3-3">
<button class="collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-3" aria-expanded="false" aria-controls="accordion-collapse-3-3">Do you offer a free trial edit?</button>
</div>
<!-- /.card-header -->
<div id="accordion-collapse-3-3" class="collapse" aria-labelledby="accordion-heading-3-3" data-bs-target="#accordion-3">
<div class="card-body">
<p>Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec sed odio dui. Cras justo odio, dapibus ac facilisis.</p>
</div>
<!-- /.card-body -->
</div>
<!-- /.collapse -->
</div>
<!-- /.card -->
<div class="card accordion-item shadow-lg">
<div class="card-header" id="accordion-heading-3-4">
<button class="collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-4" aria-expanded="false" aria-controls="accordion-collapse-3-4">How do I reset my Account password?</button>
</div>
<!-- /.card-header -->
<div id="accordion-collapse-3-4" class="collapse" aria-labelledby="accordion-heading-3-4" data-bs-target="#accordion-3">
<div class="card-body">
<p>Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec sed odio dui. Cras justo odio, dapibus ac facilisis.</p>
</div>
<!-- /.card-body -->
</div>
<!-- /.collapse -->
</div>
<!-- /.card -->
</div>
<!-- /.accordion-wrapper -->
</div>
<!-- /column -->
</div>
<!-- /.row -->
</div>
<!-- /.container -->
</section>
<!-- /section -->
</div>
<!-- /.content-wrapper -->
<footer class="bg-dark text-inverse">
<div class="container py-13 py-md-15">
@@include('_footer-widgets.html', {
"lightText": true
})
</div>
<!-- /.container -->
</footer>
@@include('_page-progress.html')
@@include('_scripts.html')
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink