Access_New/pages/demo-hosting-pricing.html
2024-09-05 11:33:27 +05:45

499 lines
28 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

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

<!doctype html>
<html class="no-js" lang="en">
<head>
<title>Crafto - The Multipurpose HTML5 Template</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="author" content="ThemeZaa">
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<meta name="description" content="Elevate your online presence with Crafto - a modern, versatile, multipurpose Bootstrap 5 responsive HTML5, SCSS template using highly creative 52+ ready demos.">
<link rel="shortcut icon" href="images/favicon.png">
<link rel="apple-touch-icon" href="images/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
<link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="css/vendors.min.css" />
<link rel="stylesheet" href="css/icon.min.css" />
<link rel="stylesheet" href="css/style.min.css" />
<link rel="stylesheet" href="css/responsive.min.css" />
<link rel="stylesheet" href="demos/hosting/hosting.css" />
</head>
<body data-mobile-nav-style="full-screen-menu" data-mobile-nav-bg-color>
<header class="header-with-topbar">
<div class="header-top-bar top-bar-dark cover-background" style="background-image: url('images/demo-hosting-header-bg.jpg')">
<div class="container-fluid">
<div class="row h-42px align-items-center m-0">
<div class="col-md-7 text-center text-md-start">
<div class="fs-13 text-white"><span class="opacity-6 me-5px">Get a hosting plans, as low as starting at only</span><span class="fw-600">$2.78/mo*</span></div>
</div>
<div class="col-5 text-end d-none d-md-flex">
<a href="demo-hosting-contact.html" class="widget fs-13 me-20px text-white opacity-8 d-none d-lg-inline-block"><i class="feather icon-feather-phone"></i>Customer service</a>
<a href="cdn-cgi/l/email-protection.html#67141217170815132703080a060e094904080a" class="widget fs-13 text-white text-white-hover opacity-8"><i class="feather icon-feather-mail text-white position-relative top-1px"></i><span class="__cf_email__" data-cfemail="57242227273825231733383a363e397934383a">[email&#160;protected]</span></a>
</div>
</div>
</div>
</div>
<nav class="navbar navbar-expand-lg header-transparent bg-transparent header-reverse" data-header-hover="light">
<div class="container-fluid">
<div class="col-auto col-lg-2 me-lg-0 me-auto">
<a class="navbar-brand" href="demo-hosting.html">
<img src="images/demo-hosting-logo-white.png" data-at2x="images/demo-hosting-logo-white@2x.png" alt class="default-logo">
<img src="images/demo-hosting-logo-black.png" data-at2x="images/demo-hosting-logo-black@2x.png" alt class="alt-logo">
<img src="images/demo-hosting-logo-black.png" data-at2x="images/demo-hosting-logo-black@2x.png" alt class="mobile-logo">
</a>
</div>
<div class="col-auto menu-order position-static">
<button class="navbar-toggler float-start" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-line"></span>
<span class="navbar-toggler-line"></span>
<span class="navbar-toggler-line"></span>
<span class="navbar-toggler-line"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item"><a href="demo-hosting.html" class="nav-link">Home</a></li>
<li class="nav-item"><a href="demo-hosting-about.html" class="nav-link">About</a></li>
<li class="nav-item"><a href="demo-hosting-hosting.html" class="nav-link">Hosting</a></li>
<li class="nav-item"><a href="demo-hosting-domain.html" class="nav-link">Domain</a></li>
<li class="nav-item"><a href="demo-hosting-pricing.html" class="nav-link">Pricing</a></li>
<li class="nav-item"><a href="demo-hosting-support.html" class="nav-link">Support</a></li>
<li class="nav-item"><a href="demo-hosting-contact.html" class="nav-link">Contact</a></li>
</ul>
</div>
</div>
<div class="col-auto col-lg-2 text-end lg-pe-5px">
<div class="header-icon">
<div class="header-search-icon icon d-none d-sm-flex">
<a href="demo-hosting-pricing.html#" class="search-form-icon header-search-form"><i class="align-middle feather icon-feather-search fs-18 me-5px xl-me-0"></i><span class="align-middle d-none d-xxl-inline-block"> Search</span></a>
<div class="search-form-wrapper">
<button title="Close" type="button" class="search-close">×</button>
<form id="search-form" role="search" method="get" class="search-form text-left" action="search-result.html">
<div class="search-form-box">
<h2 class="text-dark-gray fw-700 ls-minus-2px text-center mb-4 alt-font">What are you looking for?</h2>
<input class="search-input" id="search-form-input5e219ef164995" placeholder="Enter your keywords..." name="s" value type="text" autocomplete="off">
<button type="submit" class="search-button">
<i class="feather icon-feather-search" aria-hidden="true"></i>
</button>
</div>
</form>
</div>
</div>
<div class="header-button ms-30px xxl-ms-10px xs-ms-0">
<a href="demo-hosting-pricing.html#" class="btn btn-white btn-small btn-rounded btn-box-shadow btn-switch-text fw-600">
<span>
<span class="btn-double-text" data-text="Sign up">Sign up</span>
</span>
</a>
</div>
</div>
</div>
</div>
</nav>
</header>
<section class="page-title-big-typography bg-dark-gray ipad-top-space-margin cover-background md-py-0" style="background-image: url('images/demo-hosting-pricing-bg.jpg')">
<div class="container">
<div class="row align-items-center small-screen">
<div class="col-lg-5 col-sm-7 position-relative page-title-extra-small">
<h1 class="mb-15px text-white opacity-7 fw-300 overflow-hidden">
<span class="d-inline-block" data-anime="{ &quot;translateY&quot;: [30, 0], &quot;opacity&quot;: [0, 1], &quot;easing&quot;: &quot;easeOutCubic&quot;, &quot;duration&quot;: 500, &quot;staggervalue&quot;: 300 }">Reliable pricing plans</span>
</h1>
<h2 class="m-auto pb-5px pt-5px text-white fw-600 ls-minus-1px overflow-hidden">
<span class="d-inline-block" data-anime="{ &quot;translateY&quot;: [30, 0], &quot;opacity&quot;: [0, 1], &quot;easing&quot;: &quot;easeOutCubic&quot;, &quot;duration&quot;: 500, &quot;staggervalue&quot;: 300, &quot;delay&quot;: 300 }">Simple plans for everyone</span>
</h2>
</div>
</div>
</div>
</section>
<section>
<div class="container">
<div class="row align-items-center">
<div class="col-xl-7 col-lg-6 md-mb-30px animation-float" data-anime="{ &quot;effect&quot;: &quot;slide&quot;, &quot;color&quot;: &quot;#ffffff&quot;, &quot;direction&quot;:&quot;lr&quot;, &quot;easing&quot;: &quot;easeOutQuad&quot;, &quot;delay&quot;:50}">
<img src="images/demo-hosting-home-01.png" alt>
</div>
<div class="col-xl-5 col-lg-6" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateX&quot;: [50, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 1200, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<h2 class="fw-700 text-dark-gray ls-minus-2px">Have a hosting question?</h2>
<div class="accordion accordion-style-02" id="accordion-style-02" data-active-icon="icon-feather-chevron-up" data-inactive-icon="icon-feather-chevron-down">
<div class="accordion-item active-accordion">
<div class="accordion-header border-bottom border-color-extra-medium-gray">
<a href="demo-hosting-pricing.html#" data-bs-toggle="collapse" data-bs-target="#accordion-style-02-01" aria-expanded="true" data-bs-parent="#accordion-style-02">
<div class="accordion-title mb-0 position-relative text-dark-gray pe-30px">
<i class="feather icon-feather-chevron-up icon-extra-medium"></i><span class="fw-600 fs-18">How long is this site live?</span>
</div>
</a>
</div>
<div id="accordion-style-02-01" class="accordion-collapse collapse show" data-bs-parent="#accordion-style-02">
<div class="accordion-body last-paragraph-no-margin border-bottom border-color-light-medium-gray">
<p>Lorem ipsum is simply dummy text of the printing and typesetting industry dummy text unknown printer.</p>
</div>
</div>
</div>
<div class="accordion-item">
<div class="accordion-header border-bottom border-color-extra-medium-gray">
<a href="demo-hosting-pricing.html#" data-bs-toggle="collapse" data-bs-target="#accordion-style-02-02" aria-expanded="false" data-bs-parent="#accordion-style-02">
<div class="accordion-title mb-0 position-relative text-dark-gray pe-30px">
<i class="feather icon-feather-chevron-down icon-extra-medium"></i><span class="fw-600 fs-18">Can i install/upload anything is want on there?</span>
</div>
</a>
</div>
<div id="accordion-style-02-02" class="accordion-collapse collapse" data-bs-parent="#accordion-style-02">
<div class="accordion-body last-paragraph-no-margin border-bottom border-color-light-medium-gray">
<p>Lorem ipsum is simply dummy text of the printing and typesetting industry dummy text unknown printer.</p>
</div>
</div>
</div>
<div class="accordion-item">
<div class="accordion-header border-bottom border-color-transparent">
<a href="demo-hosting-pricing.html#" data-bs-toggle="collapse" data-bs-target="#accordion-style-02-04" aria-expanded="false" data-bs-parent="#accordion-style-02">
<div class="accordion-title mb-0 position-relative text-dark-gray pe-30px">
<i class="feather icon-feather-chevron-down icon-extra-medium"></i><span class="fw-600 fs-18">Can i change the domain you give me?</span>
</div>
</a>
</div>
<div id="accordion-style-02-04" class="accordion-collapse collapse" data-bs-parent="#accordion-style-02">
<div class="accordion-body last-paragraph-no-margin border-bottom border-color-transparent">
<p>Lorem ipsum is simply dummy text of the printing and typesetting industry dummy text unknown printer.</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row justify-content-center mt-3">
<div class="col-auto icon-with-text-style-08 sm-mb-10px" data-anime="{ &quot;translateX&quot;: [-50, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="feature-box feature-box-left-icon-middle">
<div class="feature-box-icon me-10px">
<i class="bi bi-envelope icon-small text-dark-gray"></i>
</div>
<div class="feature-box-content">
<span class="alt-font text-dark-gray fw-500 fs-18">Looking for help? <a href="demo-hosting-pricing.html#" class="text-decoration-line-bottom text-base-color fw-600">Submit a ticket</a></span>
</div>
</div>
</div>
<div class="col-auto icon-with-text-style-08" data-anime="{ &quot;translateX&quot;: [50, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 600, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 300, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="feature-box feature-box-left-icon-middle">
<div class="feature-box-icon me-10px">
<i class="bi bi-chat-dots icon-small text-dark-gray"></i>
</div>
<div class="feature-box-content">
<span class="alt-font text-dark-gray fw-500 fs-18">Keep in Touch. <a href="demo-hosting-pricing.html#" class="text-decoration-line-bottom text-base-color fw-600">Like us on Facebook</a></span>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="bg-very-light-gray">
<div class="container">
<div class="row justify-content-center mb-2">
<div class="col-md-10 text-center" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateY&quot;: [50, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 1200, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<span class="text-base-color fw-600 mb-5px text-uppercase d-block">Simple pricing plans</span>
<h2 class="fw-700 mb-15px text-dark-gray ls-minus-2px">Plans for everyone</h2>
</div>
</div>
<div class="row">
<div class="col pricing-table-style-08">
<div class="d-flex justify-content-center mb-5 xs-mb-10" data-anime="{ &quot;el&quot;: &quot;childs&quot;, &quot;translateY&quot;: [50, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 1200, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<ul class="nav nav-tabs nav-swich-tabs alt-font justify-content-center border-0 text-center alt-font fw-500">
<li class="nav-item w-auto">
<a class="nav-link active text-dark-gray d-flex align-items-center" data-bs-toggle="tab" href="demo-hosting-pricing.html#tab_six3"><span class="tab-nav-text">Monthly</span></a>
</li>
<li class="nav-item w-auto">
<a class="nav-link d-flex align-items-center" data-bs-toggle="tab" href="demo-hosting-pricing.html#tab_six4"><span class="tab-nav-text">Annualy - Save 50%</span></a>
</li>
</ul>
</div>
<div class="tab-content">
<div class="tab-pane fade in active show" id="tab_six3">
<div class="row align-items-center justify-content-center">
<div class="col-lg-4 col-md-8 pricing-table-style-08 md-mb-30px" data-anime="{ &quot;translateX&quot;: [50, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 1200, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="pricing-table text-center pt-16 pb-35px bg-white box-shadow-quadruple-large border-radius-6px">
<div class="pricing-header ps-18 pe-18 md-ps-12 md-pe-12">
<div class="d-inline-block fs-12 text-uppercase bg-white ps-20px pe-20px fw-600 text-dark-gray mb-30px border-radius-100px box-shadow-large border border-1 border-color-extra-medium-gray">Standard</div>
<h2 class="text-dark-gray fw-600 mb-10px ls-minus-3px"><sup class="fs-30">$</sup>500</h2>
<p class="mb-25px lh-28">All the basics for businesses that are just getting started.</p>
<a href="demo-hosting-pricing.html#" class="btn btn-large btn-dark-gray btn-round-edge btn-switch-text btn-box-shadow">
<span>
<span class="btn-double-text" data-text="Choose package">Choose package</span>
</span>
</a>
<span class="fs-13 w-100 d-block mt-5px">Monthly billing</span>
</div>
<div class="pricing-body pt-15px pb-25px">
<ul class="list-style-01 ps-0 mb-0">
<li class="border-color-transparent-dark-very-light pt-10px pb-10px">Unlimited bandwidth</li>
<li class="border-color-transparent-dark-very-light pt-10px pb-10px"><span class="opacity-6">Full backup systems</span></li>
<li class="border-color-transparent-dark-very-light border-bottom pt-10px pb-10px"><span class="opacity-6">Unlimited database</span></li>
</ul>
</div>
<div class="pricing-footer">
<a href="demo-hosting-pricing.html#" class="text-decoration-line-bottom d-inline-block text-dark-gray fw-500 ls-minus-05px">Get your 30 day free trial</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-8 pricing-table-style-08 md-mb-30px" data-anime="{ &quot;translateX&quot;: [0, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 1200, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="pricing-table text-center pt-16 pb-35px bg-white box-shadow-quadruple-large border-radius-6px">
<div class="pricing-header ps-18 pe-18 md-ps-12 md-pe-12">
<div class="d-inline-block fs-12 text-uppercase bg-white ps-20px pe-20px fw-600 text-dark-gray mb-30px border-radius-100px box-shadow-large border border-1 border-color-extra-medium-gray">Business</div>
<h2 class="text-dark-gray fw-600 mb-10px ls-minus-3px"><sup class="fs-30">$</sup>850</h2>
<p class="mb-25px lh-28">All the basics for businesses that are just getting started.</p>
<a href="demo-hosting-pricing.html#" class="btn btn-large btn-yellow btn-round-edge btn-switch-text btn-box-shadow">
<span>
<span class="btn-double-text" data-text="Choose package">Choose package</span>
</span>
</a>
<span class="fs-13 w-100 d-block mt-5px">Monthly billing</span>
</div>
<div class="pricing-body pt-15px pb-25px">
<ul class="list-style-01 ps-0 mb-0">
<li class="border-color-transparent-dark-very-light pt-10px pb-10px">Unlimited bandwidth</li>
<li class="border-color-transparent-dark-very-light pt-10px pb-10px">Full backup systems</li>
<li class="border-color-transparent-dark-very-light border-bottom pt-10px pb-10px"><span class="opacity-6">Unlimited database</span></li>
</ul>
</div>
<div class="pricing-footer">
<a href="demo-hosting-pricing.html#" class="text-decoration-line-bottom d-inline-block text-dark-gray fw-500 ls-minus-05px">Get your 30 day free trial</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-8 pricing-table-style-08" data-anime="{ &quot;translateX&quot;: [-50, 0], &quot;opacity&quot;: [0,1], &quot;duration&quot;: 1200, &quot;delay&quot;: 0, &quot;staggervalue&quot;: 150, &quot;easing&quot;: &quot;easeOutQuad&quot; }">
<div class="pricing-table text-center pt-16 pb-35px bg-white box-shadow-quadruple-large border-radius-6px">
<div class="pricing-header ps-18 pe-18 md-ps-12 md-pe-12">
<div class="d-inline-block fs-12 text-uppercase bg-white ps-20px pe-20px fw-600 text-dark-gray mb-30px border-radius-100px box-shadow-large border border-1 border-color-extra-medium-gray">Ultimate</div>
<h2 class="text-dark-gray fw-600 mb-10px ls-minus-3px"><sup class="fs-30">$</sup>950</h2>
<p class="mb-25px lh-28">All the basics for businesses that are just getting started.</p>
<a href="demo-hosting-pricing.html#" class="btn btn-large btn-dark-gray btn-round-edge btn-switch-text btn-box-shadow">
<span>
<span class="btn-double-text" data-text="Choose package">Choose package</span>
</span>
</a>
<span class="fs-13 w-100 d-block mt-5px">Monthly billing</span>
</div>
<div class="pricing-body pt-15px pb-25px">
<ul class="list-style-01 ps-0 mb-0">
<li class="border-color-transparent-dark-very-light pt-10px pb-10px">Unlimited bandwidth</li>
<li class="border-color-transparent-dark-very-light pt-10px pb-10px">Full backup systems</li>
<li class="border-color-transparent-dark-very-light border-bottom pt-10px pb-10px">Unlimited database</li>
</ul>
</div>
<div class="pricing-footer">
<a href="demo-hosting-pricing.html#" class="text-decoration-line-bottom d-inline-block text-dark-gray fw-500 ls-minus-05px">Get your 30 day free trial</a>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane fade in" id="tab_six4">
<div class="row align-items-center justify-content-center">
<div class="col-lg-4 col-md-8 pricing-table-style-08 md-mb-30px">
<div class="pricing-table text-center pt-16 pb-35px bg-white box-shadow-quadruple-large border-radius-6px">
<div class="pricing-header ps-18 pe-18 md-ps-12 md-pe-12">
<div class="d-inline-block fs-12 text-uppercase bg-white ps-20px pe-20px fw-600 text-dark-gray mb-30px border-radius-100px box-shadow-large border border-1 border-color-extra-medium-gray">Standard</div>
<h2 class="text-dark-gray fw-600 mb-10px ls-minus-3px"><sup class="fs-30">$</sup>250</h2>
<p class="mb-25px lh-28">All the basics for businesses that are just getting started.</p>
<a href="demo-hosting-pricing.html#" class="btn btn-large btn-dark-gray btn-round-edge btn-switch-text btn-box-shadow">
<span>
<span class="btn-double-text" data-text="Choose package">Choose package</span>
</span>
</a>
<span class="fs-13 w-100 d-block mt-5px">Monthly billing</span>
</div>
<div class="pricing-body pt-15px pb-25px">
<ul class="list-style-01 ps-0 mb-0">
<li class="border-color-transparent-dark-very-light pt-10px pb-10px">Unlimited bandwidth</li>
<li class="border-color-transparent-dark-very-light pt-10px pb-10px"><span class="opacity-6">Full backup systems</span></li>
<li class="border-color-transparent-dark-very-light border-bottom pt-10px pb-10px"><span class="opacity-6">Unlimited database</span></li>
</ul>
</div>
<div class="pricing-footer">
<a href="demo-hosting-pricing.html#" class="text-decoration-line-bottom d-inline-block text-dark-gray fw-500 ls-minus-05px">Get your 30 day free trial</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-8 pricing-table-style-08 md-mb-30px">
<div class="pricing-table text-center pt-16 pb-35px bg-white box-shadow-quadruple-large border-radius-6px">
<div class="pricing-header ps-18 pe-18 md-ps-12 md-pe-12">
<div class="d-inline-block fs-12 text-uppercase bg-white ps-20px pe-20px fw-600 text-dark-gray mb-30px border-radius-100px box-shadow-large border border-1 border-color-extra-medium-gray">Business</div>
<h2 class="text-dark-gray fw-600 mb-10px ls-minus-3px"><sup class="fs-30">$</sup>350</h2>
<p class="mb-25px lh-28">All the basics for businesses that are just getting started.</p>
<a href="demo-hosting-pricing.html#" class="btn btn-large btn-yellow btn-round-edge btn-switch-text btn-box-shadow">
<span>
<span class="btn-double-text" data-text="Choose package">Choose package</span>
</span>
</a>
<span class="fs-13 w-100 d-block mt-5px">Monthly billing</span>
</div>
<div class="pricing-body pt-15px pb-25px">
<ul class="list-style-01 ps-0 mb-0">
<li class="border-color-transparent-dark-very-light pt-10px pb-10px">Unlimited bandwidth</li>
<li class="border-color-transparent-dark-very-light pt-10px pb-10px">Full backup systems</li>
<li class="border-color-transparent-dark-very-light border-bottom pt-10px pb-10px"><span class="opacity-6">Unlimited database</span></li>
</ul>
</div>
<div class="pricing-footer">
<a href="demo-hosting-pricing.html#" class="text-decoration-line-bottom d-inline-block text-dark-gray fw-500 ls-minus-05px">Get your 30 day free trial</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-8 pricing-table-style-08">
<div class="pricing-table text-center pt-16 pb-35px bg-white box-shadow-quadruple-large border-radius-6px">
<div class="pricing-header ps-18 pe-18 md-ps-12 md-pe-12">
<div class="d-inline-block fs-12 text-uppercase bg-white ps-20px pe-20px fw-600 text-dark-gray mb-30px border-radius-100px box-shadow-large border border-1 border-color-extra-medium-gray">Ultimate</div>
<h2 class="text-dark-gray fw-600 mb-10px ls-minus-3px"><sup class="fs-30">$</sup>450</h2>
<p class="mb-25px lh-28">All the basics for businesses that are just getting started.</p>
<a href="demo-hosting-pricing.html#" class="btn btn-large btn-dark-gray btn-round-edge btn-switch-text btn-box-shadow">
<span>
<span class="btn-double-text" data-text="Choose package">Choose package</span>
</span>
</a>
<span class="fs-13 w-100 d-block mt-5px">Monthly billing</span>
</div>
<div class="pricing-body pt-15px pb-25px">
<ul class="list-style-01 ps-0 mb-0">
<li class="border-color-transparent-dark-very-light pt-10px pb-10px">Unlimited bandwidth</li>
<li class="border-color-transparent-dark-very-light pt-10px pb-10px">Full backup systems</li>
<li class="border-color-transparent-dark-very-light border-bottom pt-10px pb-10px">Unlimited database</li>
</ul>
</div>
<div class="pricing-footer">
<a href="demo-hosting-pricing.html#" class="text-decoration-line-bottom d-inline-block text-dark-gray fw-500 ls-minus-05px">Get your 30 day free trial</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<footer class="footer-dark bg-dark-blue pb-0 cover-background background-position-left-top" style="background-image: url('images/demo-hosting-footer-bg.jpg')">
<div class="container">
<div class="row justify-content-center mb-5 md-mb-8 sm-mb-40px">
<div class="col-6 col-lg-3 last-paragraph-no-margin order-sm-1 md-mb-40px xs-mb-30px">
<a href="demo-hosting.html" class="footer-logo mb-15px d-inline-block"><img src="images/demo-hosting-logo-white.png" data-at2x="images/demo-hosting-logo-white@2x.png" alt></a>
<p class="w-90 lg-w-100">Lorem ipsum amet adipiscing elit to eiusmod ad tempor incididunt enim.</p>
<div class="elements-social social-icon-style-02 mt-20px xs-mt-15px">
<ul class="small-icon light">
<li class="my-0"><a class="facebook" href="https://www.facebook.com/" target="_blank"><i class="fa-brands fa-facebook-f"></i></a></li>
<li class="my-0"><a class="dribbble" href="http://www.dribbble.com" target="_blank"><i class="fa-brands fa-dribbble"></i></a></li>
<li class="my-0"><a class="twitter" href="https://www.twitter.com" target="_blank"><i class="fa-brands fa-twitter"></i></a></li>
<li class="my-0"><a class="instagram" href="https://www.instagram.com" target="_blank"><i class="fa-brands fa-instagram"></i></a></li>
</ul>
</div>
</div>
<div class="col-6 col-lg-2 col-sm-4 xs-mb-30px order-sm-3 order-lg-2">
<span class="fs-17 fw-500 d-block text-white mb-5px">Company</span>
<ul>
<li><a href="demo-hosting-about.html">About</a></li>
<li><a href="demo-hosting-hosting.html">Hosting</a></li>
<li><a href="demo-hosting-domain.html">Domain</a></li>
<li><a href="demo-hosting-pricing.html">Pricing</a></li>
</ul>
</div>
<div class="col-6 col-lg-2 col-sm-4 xs-mb-30px order-sm-4 order-lg-3">
<span class="fs-17 fw-500 d-block text-white mb-5px">Customer</span>
<ul>
<li><a href="demo-hosting-support.html">Client support</a></li>
<li><a href="demo-hosting-support.html">Help center</a></li>
<li><a href="demo-hosting-about.html">System status</a></li>
<li><a href="demo-hosting-contact.html">Feedback</a></li>
</ul>
</div>
<div class="col-6 col-lg-2 col-sm-4 xs-mb-30px order-sm-5 order-lg-4">
<span class="fs-17 fw-500 d-block text-white mb-5px">Say hello</span>
<span class="d-inline-flex w-100">Need support?</span>
<a href="cdn-cgi/l/email-protection.html#7f17163f1b10121e1611511c1012" class="text-white lh-22 text-decoration-line-bottom d-inline-block mb-20px"><span class="__cf_email__" data-cfemail="553d3c15313a38343c3b7b363a38">[email&#160;protected]</span></a>
<span class="d-inline-flex w-100">Customer care</span>
<a href="tel:12345678910" class="text-white lh-22 d-inline-flex">+1 234 567 8910</a>
</div>
<div class="col-lg-3 col-sm-6 ps-30px sm-ps-15px md-mb-40px xs-mb-0 order-sm-2 order-lg-5">
<span class="fs-17 fw-500 d-block text-white mb-5px">Subscribe our newsletter</span>
<p class="mb-20px">Subscribe our newsletter to get the latest news and updates!</p>
<div class="d-inline-block w-100 newsletter-style-02 position-relative mb-15px">
<form action="email-templates/subscribe-newsletter.php" method="post" class="position-relative w-100">
<input class="input-small bg-transparent-white-light border-color-transparent w-100 form-control pe-50px ps-20px lg-ps-15px required" type="email" name="email" placeholder="Enter your email" />
<input type="hidden" name="redirect" value>
<button class="btn pe-20px submit" aria-label="submit"><i class="icon bi bi-envelope icon-small text-white"></i></button>
<div class="form-results border-radius-4px pt-5px pb-5px ps-15px pe-15px fs-14 lh-22 mt-10px w-100 text-center position-absolute d-none"></div>
</form>
</div>
<div class="footer-card">
<a href="demo-hosting-pricing.html#" class="d-inline-block me-5px xxl-me-0 align-middle"><img src="images/demo-decor-store-payment-icon-01.png" alt></a>
<a href="demo-hosting-pricing.html#" class="d-inline-block me-5px xxl-me-0 align-middle"><img src="images/demo-decor-store-payment-icon-02.png" alt></a>
<a href="demo-hosting-pricing.html#" class="d-inline-block me-5px xxl-me-0 align-middle"><img src="images/demo-decor-store-payment-icon-03.png" alt></a>
<a href="demo-hosting-pricing.html#" class="d-inline-block me-5px xxl-me-0 align-middle"><img src="images/demo-decor-store-payment-icon-04.png" alt></a>
</div>
</div>
</div>
<div class="border-top border-color-transparent-white-light pt-35px pb-35px text-center">
<span class="fs-13 w-60 lg-w-70 md-w-100 d-block mx-auto lh-22">This site is protected by reCAPTCHA and the Google <a href="demo-hosting-pricing.html#" class="text-white text-decoration-line-bottom">privacy policy</a> and <a href="demo-hosting-pricing.html#" class="text-white text-decoration-line-bottom">terms of service</a> apply. You must not use this website if you disagree with any of these website standard terms and conditions.</span>
</div>
</div>
</footer>
<div class="scroll-progress d-none d-xxl-block">
<a href="demo-hosting-pricing.html#" class="scroll-top" aria-label="scroll">
<span class="scroll-text">Scroll</span><span class="scroll-line"><span class="scroll-point"></span></span>
</a>
</div>
<script data-cfasync="false" src="cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/vendors.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
</body>
</html>