| 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=Nunito:wght@300;400;600;700&family=Playfair+Display:wght@400;700&display=swap" rel="stylesheet">
<!-- Core Style -->
<link rel="stylesheet" href="style.css">
<!-- Font Icons -->
<link rel="stylesheet" href="css/font-icons.css">
<!-- Plugins/Components CSS -->
<link rel="stylesheet" href="css/swiper.css">
<link rel="stylesheet" href="css/components/bs-switches.css">
<!-- Niche Demos -->
<link rel="stylesheet" href="demos/articles/articles.css">
<!-- Custom CSS -->
<link rel="stylesheet" href="css/custom.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Document Title
============================================= -->
<title>Articles | Canvas</title>
</head>
<body class="stretched">
<!-- Document Wrapper
============================================= -->
<div id="wrapper">
<!-- Header
============================================= -->
<header id="header" class="border-bottom-0">
<div id="header-wrap">
<div class="container">
<div class="header-row">
<!-- Logo
============================================= -->
<div id="logo">
<a href="demo-articles.html">
<img class="logo-default" srcset="demos/articles/images/logo.png, demos/articles/images/[email protected] 2x" src="demos/articles/images/[email protected]" alt="Canvas Logo">
</a>
</div><!-- #logo end -->
<div class="header-misc">
<!-- Top Search
============================================= -->
<div id="top-search" class="header-misc-icon">
<a href="#" id="top-search-trigger"><i class="uil uil-search"></i><i class="bi-x-lg"></i></a>
</div><!-- #top-search end -->
</div>
<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">
<ul class="menu-container">
<li class="menu-item"><a href="demo-articles-about.html" class="menu-link ls-0"><div>About us</div></a></li>
<li class="menu-item"><a href="demo-articles-books.html" class="menu-link ls-0"><div>Articles</div></a>
<ul class="sub-menu-container">
<li class="menu-item"><a href="demo-articles-single.html" class="menu-link ls-0"><div>Single</div></a></li>
</ul>
</li>
<li class="menu-item"><a href="#" class="menu-link ls-0" data-scrollto="#footer" data-highlight="yellow" data-speed="1200"><div>Contact Us</div></a></li>
</ul>
</nav><!-- #primary-menu end -->
<form class="top-search-form" action="search.html" method="get">
<input type="text" name="q" class="form-control" value="" placeholder="Type & Hit Enter.." autocomplete="off">
</form>
</div>
</div>
</div>
<div class="header-wrap-clone"></div>
</header><!-- #header end -->
<!-- Slider
============================================= -->
<section id="slider" class="slider-element swiper_wrapper min-vh-0">
<div class="slider-inner">
<div class="swiper-container swiper-parent">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="container">
<div class="row align-items-center mt-5">
<div class="col-xl-6 pe-0 pe-xl-5 col-md-5 col-sm-11 col-12 mb-5 mb-lg-0">
<div class="heading-block border-bottom-0 mb-4">
<div class="before-heading mb-2">02 February 2021 <span class="badge bg-secondary ms-1">Featured</span></div>
<h2 class="fw-bold ls-0 text-transform-none">Complete Recipes for Vegetarians.</h2>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda praesentium eius, similique reprehenderit ab voluptatibus eaque. Nobis maxime recusandae aliquid, id impedit aperiam dolore quas, illo eum quam. Architecto, reiciendis.</p>
<div class="article-info mb-4 d-flex align-items-center justify-content-between">
<div class="rating-stars ms-1"><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-half"></i></div>
<h5 class="mb-0">by: <a href="#">Samuel Serif</a></h5>
<span class="article-price fw-bold ms-1"><del>$50.00</del> $42.00</span>
</div>
<a href="#" class="button button-large text-transform-none ms-0"><i class="bi-cart"></i> Add to Cart</a>
</div>
<div class="col-xl-2 col-md-3 col-4 parallax" data-0="transform: translateY(0px);" data-600="transform: translateY(-30px);">
<img src="demos/articles/images/articles/1/1.png" alt="Image" class="rounded faster" data-animate="fadeInLeft">
<div class="card mt-3 d-none d-sm-block faster" data-animate="fadeInLeft" data-delay="100">
<div class="card-body rounded bg-color dark">
<h4 class="mb-2 font-body">Demo Heading</h4>
<p class="mb-0">Sunt, laborum, nemo. Aperiam. Lorem ipsum dolor sit consectetur adipisicing elit.</p>
</div>
</div>
</div>
<div class="col-xl-2 col-md-2 col-4 p-0 parallax" data-0="transform: translateY(0);" data-600="transform: translateY(20px);">
<img src="demos/articles/images/articles/1/4.png" alt="Image" class="faster rounded" data-animate="fadeInLeft" data-delay="200">
<img src="demos/articles/images/articles/1/2.png" alt="Image" class="faster rounded mt-3" data-animate="fadeInLeft" data-delay="300">
</div>
<div class="col-xl-2 col-md-2 col-4 parallax" data-0="transform: translateY(0px);" data-600="transform: translateY(-20px);">
<img src="demos/articles/images/articles/1/3.png" alt="Image" class="faster rounded" data-animate="fadeInLeft" data-delay="400">
<img src="demos/articles/images/articles/1/5.png" alt="Image" class="faster rounded mt-3" data-animate="fadeInLeft" data-delay="500">
</div>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="container">
<div class="row align-items-center mt-5">
<div class="col-xl-6 pe-0 pe-xl-5 col-md-6 col-sm-11 col-12 mb-5 mb-lg-0">
<div class="heading-block border-bottom-0 mb-4">
<div class="before-heading mb-2">16 March 2021 <span class="badge bg-secondary ms-1">Featured</span></div>
<h2 class="fw-bold ls-0 text-transform-none">The Darkness of the Flame</h2>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quam ipsa harum obcaecati, et quo facilis itaque minima tempore voluptates suscipit.</p>
<div class="article-info mb-4 d-flex align-items-center justify-content-between">
<div class="rating-stars ms-1"><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></div>
<h5>by: <a href="#">Hans Down</a></h5>
<span class="article-price fw-bold ms-1"><del>$60.00</del> $49.99</span>
</div>
<a href="#" class="button button-large text-transform-none ms-0"><i class="bi-cart"></i> Add to Cart</a>
</div>
<div class="col-xl-3 col-md-3 col-6 parallax" data-0="transform: translateY(0px);" data-600="transform: translateY(-30px);">
<img src="demos/articles/images/articles/2/1.png" alt="Image" class="rounded" data-animate="faster fadeInLeft">
<div class="card mt-3" data-animate="faster fadeInLeft" data-delay="100">
<div class="card-body rounded bg-color dark">
<h4 class="mb-2 font-body">Demo Heading</h4>
<p class="mb-0">Sunt, laborum, nemo. Aperiam. Lorem ipsum dolor sit consectetur adipisicing elit.</p>
</div>
</div>
</div>
<div class="col-xl-3 col-md-3 col-6 p-0 parallax" data-0="transform: translateY(0);" data-600="transform: translateY(40px);">
<img src="demos/articles/images/articles/2/2.png" alt="Image" class="rounded" data-animate="faster fadeInLeft" data-delay="200">
</div>
</div>
</div>
</div>
</div>
<div class="slider-arrow-left"><i class="uil uil-angle-left-b"></i></div>
<div class="slider-arrow-right"><i class="uil uil-angle-right-b"></i></div>
</div>
</div>
</section>
<!-- Content
============================================= -->
<section id="content">
<div class="content-wrap pb-0">
<div class="section section-features m-0" style="padding: 120px 0;">
<div class="container">
<div class="row justify-content-start justify-content-sm-center justify-content-md-start">
<div class="col-lg-4 col-md-6">
<div class="heading-block services-info pe-1">
<h2 class="fw-normal ls-0 text-transform-none font-primary">Our Services</h2>
<p class="lead">Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
</div>
</div>
</div>
<div class="row align-items-md-center mt-3">
<div class="col-md-4 px-lg-4">
<div class="card p-2 py-lg-5 px-xl-3 px-lg-2">
<div class="card-body rounded">
<div class="feature-box media-box">
<div class="fbox-icon position-relative mb-4" style="width: 70px;height: 70px">
<svg enable-background="new 0 0 485.5 485.5" viewBox="0 0 485.5 485.5" xmlns="https://www.w3.org/2000/svg"><path d="m422.1 126.2h-295.7c-27.4 0-49.8-22.3-49.8-49.8 0-27.4 22.3-49.8 49.8-49.8h295.8c7.4 0 13.3-6 13.3-13.3 0-7.4-6-13.3-13.3-13.3h-295.8c-42.1 0-76.4 34.3-76.4 76.4v332.7c0 42.1 34.3 76.4 76.4 76.4h295.8c7.4 0 13.3-6 13.3-13.3v-332.7c-.1-7.3-6-13.3-13.4-13.3zm-13.3 332.7h-282.4c-27.4 0-49.8-22.3-49.8-49.8v-274.7c13.4 11.5 30.8 18.5 49.8 18.5h282.4z"><path d="m130.6 64.3c-7.4 0-13.3 6-13.3 13.3s6 13.3 13.3 13.3h249.8c7.4 0 13.3-6 13.3-13.3s-6-13.3-13.3-13.3z"><path d="m177.4 400.7c1.5.5 3 .8 4.5.8 5.5 0 10.6-3.4 12.5-8.8l16.2-45.3h62.4c.5 0 1.1 0 1.6-.1l16.2 45.4c1.9 5.4 7.1 8.8 12.5 8.8 1.5 0 3-.3 4.5-.8 6.9-2.5 10.5-10.1 8-17l-60.6-169.9c-.1-.4-.3-.8-.5-1.2-.1-.2-.2-.4-.3-.6s-.2-.4-.3-.6-.3-.4-.4-.7c-.1-.1-.2-.3-.3-.4-.1-.2-.3-.4-.5-.6-.1-.1-.2-.3-.4-.4-.1-.2-.3-.3-.5-.5s-.3-.3-.5-.5c-.1-.1-.3-.2-.4-.4-.2-.2-.4-.3-.6-.5-.1-.1-.3-.2-.4-.3-.2-.1-.4-.3-.6-.4s-.4-.2-.6-.3-.4-.2-.6-.3c-.4-.2-.8-.4-1.2-.5h-.1c-.4-.1-.8-.2-1.2-.3-.2 0-.3-.1-.5-.1-.3-.1-.5-.1-.8-.2-.2 0-.4 0-.6-.1-.2 0-.5-.1-.7-.1s-.4 0-.6 0-.4 0-.7 0c-.2 0-.5 0-.7.1-.2 0-.4 0-.6.1-.3 0-.5.1-.8.2-.2 0-.3.1-.5.1-.4.1-.8.2-1.1.3h-.1c-.4.1-.8.3-1.2.5-.2.1-.4.2-.6.3s-.4.2-.6.3-.4.3-.7.4c-.1.1-.3.2-.4.3-.2.2-.4.3-.6.5-.1.1-.3.2-.4.4-.2.2-.3.3-.5.5s-.3.3-.5.5c-.1.1-.2.3-.4.4-.2.2-.3.4-.5.6-.1.1-.2.3-.3.4-.1.2-.3.4-.4.6s-.2.4-.3.6-.2.4-.3.6c-.2.4-.4.8-.5 1.2l-60.8 169.9c-2.2 7 1.4 14.6 8.3 17.1zm65.3-142.9 22.5 63h-45.1z"></svg>
</div>
<div class="fbox-content">
<h3 class="fw-normal ls-0 text-transform-none">25+ Multiple Languages.</h3>
<p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi rem, facilis nobis voluptatum.</p>
<a href="#" class="btn btn-link font-body mt-3 p-0">Read More..</a>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-4 px-lg-4 mt-3 mt-md-0">
<div class="card border-color-pink p-2 py-lg-5 px-xl-3 px-lg-2">
<div class="card-body rounded">
<div class="feature-box media-box">
<div class="fbox-icon position-relative mb-3" style="width: 70px;height: 70px">
<svg enable-background="new 0 0 464.585 464.585" viewBox="0 0 464.585 464.585" xmlns="https://www.w3.org/2000/svg"><path d="m464.585 393.312-87.463-315.015-75.392 20.932 8.329 29.998h-83.857v-41.781h-78.243v30.92h-42.373v-68.159h-105.586v364.17h90.586 15 42.373 15 48.243 15 98.153v-233.662l64.838 233.528zm-301.626-290.866h48.243v37.147h-48.243zm0 99.364h48.243v170.575h-48.243zm0-15v-8.608h48.243v8.608zm0-23.608v-8.609h48.243v8.609zm-72.373 206.987h-75.586v-275.99h75.586zm0-304.982v13.992h-75.586v-13.992zm-75.586 334.171v-14.189h75.586v14.189zm132.959 0h-42.373v-266.012h42.373zm15 0v-11.993h48.243v11.993zm146.396 0h-83.153v-255.152h83.153zm90.279-3.6-52.742-189.961 46.485-12.907 52.742 189.961zm-56.755-204.414-4.133-14.884 46.485-12.907 4.133 14.884zm23.802-94.602 14.537 52.358-46.485 12.907-14.537-52.358z"><path d="m243.621 160.457h48.315v15h-48.315z"><path d="m243.621 186.81h48.315v15h-48.315z"><path d="m243.621 213.164h48.315v15h-48.315z"><path d="m243.621 365.797h48.315v15h-48.315z"><path d="m119.272 272.274h15v25.255h-15z"><path d="m119.272 311.805h15v57.099h-15z"><path d="m119.272 189.919h15v68.081h-15z"><path d="m119.272 150.387h15v26.354h-15z"></svg>
</div>
<div class="fbox-content">
<h3 class="fw-normal ls-0 text-transform-none">32+ Categories Available.</h3>
<p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi rem, facilis nobis voluptatum.</p>
<a href="#" class="btn btn-link font-body mt-3 p-0">Read More..</a>
</div>
</div>
</div>
</div>
<div class="card border-color-yellow p-2 py-lg-5 px-xl-3 px-lg-2 mt-3 mt-lg-5">
<div class="card-body rounded">
<div class="feature-box media-box">
<div class="fbox-icon position-relative mb-4" style="width: auto;height: 50px">
<div class="d-flex align-items-center">
<svg width="32px" height="32px" viewBox="0 0 256 256" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid">
<g>
<path d="M127.999746,23.06353 C162.177385,23.06353 166.225393,23.1936027 179.722476,23.8094161 C192.20235,24.3789926 198.979853,26.4642218 203.490736,28.2166477 C209.464938,30.5386501 213.729395,33.3128586 218.208268,37.7917319 C222.687141,42.2706052 225.46135,46.5350617 227.782844,52.5092638 C229.535778,57.0201472 231.621007,63.7976504 232.190584,76.277016 C232.806397,89.7746075 232.93647,93.8226147 232.93647,128.000254 C232.93647,162.177893 232.806397,166.225901 232.190584,179.722984 C231.621007,192.202858 229.535778,198.980361 227.782844,203.491244 C225.46135,209.465446 222.687141,213.729903 218.208268,218.208776 C213.729395,222.687649 209.464938,225.461858 203.490736,227.783352 C198.979853,229.536286 192.20235,231.621516 179.722476,232.191092 C166.227425,232.806905 162.179418,232.936978 127.999746,232.936978 C93.8200742,232.936978 89.772067,232.806905 76.277016,232.191092 C63.7971424,231.621516 57.0196391,229.536286 52.5092638,227.783352 C46.5345536,225.461858 42.2700971,222.687649 37.7912238,218.208776 C33.3123505,213.729903 30.538142,209.465446 28.2166477,203.491244 C26.4637138,198.980361 24.3784845,192.202858 23.808908,179.723492 C23.1930946,166.225901 23.0630219,162.177893 23.0630219,128.000254 C23.0630219,93.8226147 23.1930946,89.7746075 23.808908,76.2775241 C24.3784845,63.7976504 26.4637138,57.0201472 28.2166477,52.5092638 C30.538142,46.5350617 33.3123505,42.2706052 37.7912238,37.7917319 C42.2700971,33.3128586 46.5345536,30.5386501 52.5092638,28.2166477 C57.0196391,26.4642218 63.7971424,24.3789926 76.2765079,23.8094161 C89.7740994,23.1936027 93.8221066,23.06353 127.999746,23.06353 M127.999746,0 C93.2367791,0 88.8783247,0.147348072 75.2257637,0.770274749 C61.601148,1.39218523 52.2968794,3.55566141 44.1546281,6.72008828 C35.7374966,9.99121548 28.5992446,14.3679613 21.4833489,21.483857 C14.3674532,28.5997527 9.99070739,35.7380046 6.71958019,44.1551362 C3.55515331,52.2973875 1.39167714,61.6016561 0.769766653,75.2262718 C0.146839975,88.8783247 0,93.2372872 0,128.000254 C0,162.763221 0.146839975,167.122183 0.769766653,180.774236 C1.39167714,194.398852 3.55515331,203.703121 6.71958019,211.845372 C9.99070739,220.261995 14.3674532,227.400755 21.4833489,234.516651 C28.5992446,241.632547 35.7374966,246.009293 44.1546281,249.28042 C52.2968794,252.444847 61.601148,254.608323 75.2257637,255.230233 C88.8783247,255.85316 93.2367791,256 127.999746,256 C162.762713,256 167.121675,255.85316 180.773728,255.230233 C194.398344,254.608323 203.702613,252.444847 211.844864,249.28042 C220.261995,246.009293 227.400247,241.632547 234.516143,234.516651 C241.632039,227.400755 246.008785,220.262503 249.279912,211.845372 C252.444339,203.703121 254.607815,194.398852 255.229725,180.774236 C255.852652,167.122183 256,162.763221 256,128.000254 C256,93.2372872 255.852652,88.8783247 255.229725,75.2262718 C254.607815,61.6016561 252.444339,52.2973875 249.279912,44.1551362 C246.008785,35.7380046 241.632039,28.5997527 234.516143,21.483857 C227.400247,14.3679613 220.261995,9.99121548 211.844864,6.72008828 C203.702613,3.55566141 194.398344,1.39218523 180.773728,0.770274749 C167.121675,0.147348072 162.762713,0 127.999746,0 Z M127.999746,62.2703115 C91.698262,62.2703115 62.2698034,91.69877 62.2698034,128.000254 C62.2698034,164.301738 91.698262,193.730197 127.999746,193.730197 C164.30123,193.730197 193.729689,164.301738 193.729689,128.000254 C193.729689,91.69877 164.30123,62.2703115 127.999746,62.2703115 Z M127.999746,170.667175 C104.435741,170.667175 85.3328252,151.564259 85.3328252,128.000254 C85.3328252,104.436249 104.435741,85.3333333 127.999746,85.3333333 C151.563751,85.3333333 170.666667,104.436249 170.666667,128.000254 C170.666667,151.564259 151.563751,170.667175 127.999746,170.667175 Z M211.686338,59.6734287 C211.686338,68.1566129 204.809755,75.0337031 196.326571,75.0337031 C187.843387,75.0337031 180.966297,68.1566129 180.966297,59.6734287 C180.966297,51.1902445 187.843387,44.3136624 196.326571,44.3136624 C204.809755,44.3136624 211.686338,51.1902445 211.686338,59.6734287 Z" fill="#0A0A08"></path>
</g>
</svg>
<span class="text-muted ms-3 h6 m-0">+</span>
<svg width="32" height="32" class="ms-3" viewBox="0 0 512 512" xmlns="https://www.w3.org/2000/svg"><path d="m75 512h167v-182h-60v-60h60v-75c0-41.355469 33.644531-75 75-75h75v60h-60c-16.542969 0-30 13.457031-30 30v60h87.292969l-10 60h-77.292969v182h135c41.355469 0 75-33.644531 75-75v-362c0-41.355469-33.644531-75-75-75h-362c-41.355469 0-75 33.644531-75 75v362c0 41.355469 33.644531 75 75 75zm-45-437c0-24.8125 20.1875-45 45-45h362c24.8125 0 45 20.1875 45 45v362c0 24.8125-20.1875 45-45 45h-105v-122h72.707031l20-120h-92.707031v-30h90v-120h-105c-57.898438 0-105 47.101562-105 105v45h-60v120h60v122h-137c-24.8125 0-45-20.1875-45-45zm0 0"></svg>
</div>
</div>
<div class="fbox-content">
<h3 class="fw-normal text-transform-none ls-0">On Social Networks.</h3>
<p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi rem, facilis nobis voluptatum.</p>
<a href="#" class="btn btn-link font-body mt-3 p-0">Read More..</a>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-4 px-lg-4 mt-3 mt-md-0">
<div class="card border-color-info p-2 py-lg-5 px-xl-3 px-lg-2">
<div class="card-body rounded">
<div class="feature-box media-box">
<div class="fbox-icon position-relative mb-3" style="width: 70px;height: 70px">
<svg enable-background="new 0 0 496.592 496.592" viewBox="0 0 496.592 496.592" xmlns="https://www.w3.org/2000/svg"><path d="m400.296 328v-51.696l-21.816 8.488-.064-.144-.52-.944c-8.36-13.016-21.88-22.072-37.104-24.832l-52.496-9.552v-4.144c19.632-11.4 34.008-30.848 38.488-53.84 14.544-3.008 25.512-15.912 25.512-31.336v-79.016c0-22.328-14.624-41.8-35.84-48.136l-4-4c-18.608-18.608-43.344-28.848-69.656-28.848-54.312 0-98.504 44.184-98.504 98.504v61.496c0 15.424 10.968 28.328 25.512 31.336 4.488 22.992 18.856 42.448 38.488 53.84v4.144l-52.488 9.544c-15.208 2.76-28.72 11.8-37.088 24.808l-.48 1.168-21.944-8.536v51.696c-13.232 0-24 10.768-24 24v32c0 13.232 10.768 24 24 24v29.472l152 59.12 152-59.12v-29.472c13.232 0 24-10.768 24-24v-32c0-13.232-10.768-24-24-24zm-97.008-59.688 34.64 6.296c10.2 1.856 19.232 7.744 25.256 16.128l-77.4 30.096zm-78.312-15.8c7.384 2.256 15.208 3.488 23.32 3.488s15.936-1.232 23.32-3.488l-23.32 17.488zm11.144 28.352-16.328 16.32-10.592-31.768 5.096-.92zm46.176-16.36 5.096.92-10.592 31.768-16.328-16.32zm46-90.728v-27.552c4.76 2.776 8 7.88 8 13.776s-3.24 11-8 13.776zm-160 0c-4.76-2.776-8-7.88-8-13.776s3.24-11 8-13.776zm0-53.776v9.136c-2.848.744-5.52 1.864-8 3.312v-33.944c0-45.488 37.008-82.504 82.504-82.504 22.032 0 42.76 8.584 58.344 24.168l7.056 7.064 2.152.528c15.28 3.816 25.944 17.48 25.944 33.224v51.464c-2.48-1.448-5.152-2.576-8-3.312v-9.136h-25.368c-21.68 0-42.4-10.352-55.4-27.688l-6.36-8.496-15.896 15.904c-13.088 13.08-30.48 20.28-48.976 20.28zm16 56v-40.368c19.752-1.832 38.08-10.4 52.288-24.6l3.112-3.112c16.04 17.704 39.144 28.08 63.232 28.08h9.368v40c0 35.288-28.712 64-64 64s-64-28.712-64-64zm-25.632 98.608 34.64-6.296 17.504 52.52-77.416-30.104c6.024-8.392 15.072-14.264 25.272-16.12zm-70.368 109.392v-32c0-4.416 3.592-8 8-8 13.232 0 24 10.768 24 24s-10.768 24-24 24c-4.408 0-8-3.584-8-8zm152 92.304-128-49.768v-21.928c14.104-6.192 24-20.248 24-36.608s-9.896-30.416-24-36.608v-31.696l128 49.776zm-23.752-153.232 31.752-31.76 31.752 31.752-31.752 12.352zm167.752 103.456-128 49.768v-126.824l128-49.776v31.696c-14.104 6.192-24 20.248-24 36.608s9.896 30.416 24 36.608zm24-42.528c0 4.416-3.592 8-8 8-13.232 0-24-10.768-24-24s10.768-24 24-24c4.408 0 8 3.584 8 8z"></svg>
</div>
<div class="fbox-content">
<h3 class="fw-normal ls-0 text-transform-none">Full Customer Satisfaction.</h3>
<p class="text-muted">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi rem, facilis nobis voluptatum.</p>
<a href="#" class="btn btn-link font-body mt-3 p-0">Read More..</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="section m-0 section-scroller" style="padding: 100px 0">
<div class="container text-center">
<span class="before-heading font-body">Most Popular</span>
<div class="heading-block border-bottom-0 mx-auto" style="max-width: 820px">
<h2 class="text-transform-none ls-0 fw-normal">Rapidiously pontificate tactical information visa installed base platforms.</h2>
<a href="demo-articles-books.html" class="button button-large text-transform-none px-5 ms-0 mt-4">View All</a>
</div>
</div>
<div class="swiper_wrapper customjs h-auto" style="padding: 50px 0 80px;">
<div class="swiper-container swiper-parent swiper-scroller">
<div class="swiper-wrapper h-auto">
<div class="swiper-slide">
<div class="row m-auto align-items-center">
<div class="col-md-6 p-0">
<img src="demos/articles/images/articles/1/1.png" alt="Image">
<div class="sale-flash badge bg-color text-light p-2">Sale!</div>
</div>
<div class="col-md-6 p-0">
<div class="card">
<div class="card-body py-4">
<h4 class="mb-3"><a href="#">Yanagi Canvas</a></h4>
<p class="mb-3 d-none d-sm-block">Proactively empower flexible partnerships rather than ethical products. Assertively cultivate 2.0 ROI before standardized processes.</p>
<div class="article-info mb-3 d-flex align-items-center">
<div class="rating-stars me-3"><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-half"></i></div>
<h5>by: <a href="#">Samuel Serif</a></h5>
</div>
<span class="article-price fw-bold ms-1"><del>$50.00</del> $42.00</span>
<a href="#" class="button button-small button-dark ls-0 shadow-none text-transform-none ms-0 mt-4"><i class="bi-cart"></i>Add to Cart</a>
</div>
</div>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="row m-auto align-items-center">
<div class="col-md-6 p-0">
<img src="demos/articles/images/articles/2/1.png" alt="Image">
<div class="sale-flash badge bg-color text-light p-2">Sale!</div>
</div>
<div class="col-md-6 p-0">
<div class="card">
<div class="card-body py-4">
<h4 class="mb-3"><a href="#">Learn English</a></h4>
<p class="mb-3 d-none d-sm-block">Continually impact viral web-readiness before client-focused value. Phosfluor brand global action items via principle-centered ideas.</p>
<div class="article-info mb-3 d-flex align-items-center">
<div class="rating-stars me-3"><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"></i></div>
<h5>by: <a href="#">Parsley Montana</a></h5>
</div>
<span class="article-price fw-bold ms-1"><del>$39.99</del> $29.99</span>
<a href="#" class="button button-small button-dark ls-0 shadow-none text-transform-none ms-0 mt-4"><i class="bi-cart"></i>Add to Cart</a>
</div>
</div>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="row m-auto align-items-center justify-content-center">
<div class="col-md-6 p-0">
<img src="demos/articles/images/articles/3/1.png" alt="Image">
</div>
<div class="col-md-6 p-0">
<div class="card">
<div class="card-body py-4">
<h4 class="mb-3"><a href="#">Learn English</a></h4>
<p class="mb-3 d-none d-sm-block">Continually impact viral web-readiness before client-focused value. Phosfluor brand global action items via principle-centered ideas.</p>
<div class="article-info mb-3 d-flex align-items-center">
<div class="rating-stars me-3"><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"></i></div>
<h5>by: <a href="#">Fig Nelson</a></h5>
</div>
<span class="article-price fw-bold ms-1">$29.99</span>
<a href="#" class="button button-small button-dark ls-0 shadow-none text-transform-none ms-0 mt-4"><i class="bi-cart"></i>Add to Cart</a>
</div>
</div>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="row m-auto align-items-center">
<div class="col-md-6 p-0">
<img src="demos/articles/images/articles/4/1.png" alt="Image">
</div>
<div class="col-md-6 p-0">
<div class="card">
<div class="card-body py-4">
<h4 class="mb-3"><a href="#">Woodfire Pizza</a></h4>
<p class="mb-3 d-none d-sm-block">Continually impact viral web-readiness before client-focused value. Phosfluor brand global action items via principle-centered ideas.</p>
<div class="article-info mb-3 d-flex align-items-center">
<div class="rating-stars me-3"><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"></i></div>
<h5>by: <a href="#">Norman Gordon</a></h5>
</div>
<span class="article-price fw-bold ms-1">$21.49</span>
<a href="#" class="button button-small button-dark ls-0 shadow-none text-transform-none ms-0 mt-4"><i class="bi-cart"></i>Add to Cart</a>
</div>
</div>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="row m-auto align-items-center">
<div class="col-md-6 p-0">
<img src="demos/articles/images/articles/2/1.png" alt="Image">
<div class="sale-flash badge bg-color text-light p-2">Sale!</div>
</div>
<div class="col-md-6 p-0">
<div class="card">
<div class="card-body py-4">
<h4 class="mb-3"><a href="#">My Father is a Hero</a></h4>
<p class="mb-3 d-none d-sm-block">Continually impact viral web-readiness before client-focused value. Phosfluor brand global action items via principle-centered ideas.</p>
<div class="article-info mb-3 d-flex align-items-center">
<div class="rating-stars me-3"><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"></i></div>
<h5>by: <a href="#">Hans Down</a></h5>
</div>
<span class="article-price fw-bold ms-1"><del>$60.00</del> $49.99</span>
<a href="#" class="button button-small button-dark ls-0 shadow-none text-transform-none ms-0 mt-4"><i class="bi-cart"></i>Add to Cart</a>
</div>
</div>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="row m-auto align-items-center">
<div class="col-md-6 p-0">
<img src="demos/articles/images/articles/6/1.png" alt="Image">
</div>
<div class="col-md-6 p-0">
<div class="card">
<div class="card-body py-4">
<h4 class="mb-3">Harry Potter Series</h4>
<p class="mb-3 d-none d-sm-block">Continually impact viral web-readiness before client-focused value. Phosfluor brand global action items via principle-centered ideas.</p>
<div class="article-info mb-3 d-flex align-items-center">
<div class="rating-stars me-3"><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></div>
<h5>by: <a href="#">Norman Gordon</a></h5>
</div>
<span class="article-price fw-bold ms-1">$11.49</span>
<a href="#" class="button button-small button-dark ls-0 shadow-none text-transform-none ms-0 mt-4"><i class="bi-cart"></i>Add to Cart</a>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Add Scroll Bar -->
<div class="swiper-scrollbar"></div>
<div class="slider-arrow-left slider-arrow-left-1"><i class="uil uil-angle-left-b"></i></div>
<div class="slider-arrow-right slider-arrow-right-1"><i class="uil uil-angle-right-b"></i></div>
</div>
</div>
</div>
<div class="section section-about m-0" style="padding: 120px 0; background: url('demos/articles/images/dots-1.png') 100% 0 no-repeat / 40%;">
<div class="container">
<div class="row">
<div class="col-md-5">
<h4 class="mb-0"><span class="badge bg-secondary font-body">About Us</span></h4>
<div class="heading-block">
<h2 class="fw-normal ls-0 text-transform-none mb-3 font-primary">Objectively network user friendly quality with world-class bandwidth. </h2>
</div>
<p>Progressively strategize just in time scenarios and compelling results. Intrinsicly parallel task extensive systems whereas distinctive catalysts for change. Proactively communicate standardized paradigms through proactive.</p>
<a href="#" class="button button-large ls-0 text-transform-none ms-0 mt-2">Learn More</a>
</div>
<div class="col-md-6 offset-0 offset-md-1 mt-5 mt-md-0">
<div class="circle-border">
<div class="feature-content">
<div class="d-flex align-items-center justify-content-between h-100">
<div>
<div class="circle-inner">
<div>
<div class="counter mb-0 fw-normal font-body text-primary"><span class="font-body" data-from="1" data-to="7" data-refresh-interval="10" data-speed="2000"></span>K+</div>
<h5 class="mt-1 text-muted mb-0 font-body ls-0">Books</h5>
</div>
</div>
</div>
<div class="d-flex h-100 flex-column justify-content-between">
<div class="circle-inner">
<div>
<div class="counter mb-0 fw-normal font-body text-info"><span class="font-body" data-from="1" data-to="3" data-refresh-interval="200" data-speed="23000"></span>K+</div>
<h5 class="mt-1 text-muted mb-0 font-body ls-0">Authors</h5>
</div>
</div>
<div class="circle-inner">
<div>
<div class="counter mb-0 fw-normal font-body text-danger"><span class="font-body" data-from="1" data-to="1240" data-refresh-interval="50" data-speed="2100"></span></div>
<h5 class="mt-1 text-muted mb-0 font-body ls-0">Published</h5>
</div>
</div>
<div class="circle-inner">
<div>
<div class="counter mb-0 fw-normal font-body text-warning"><span class="font-body" data-from="1" data-to="3" data-refresh-interval="100" data-speed="2400"></span>K+</div>
<h5 class="mt-1 text-muted mb-0 font-body ls-0">Members</h5>
</div>
</div>
</div>
<div>
<div class="circle-inner">
<div>
<div class="counter mb-0 fw-normal font-body color"><span class="font-body" data-from="1" data-to="220" data-refresh-interval="100" data-speed="2400"></span></div>
<h5 class="mt-1 text-muted mb-0 font-body ls-0">Free Items</h5>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="section bg-transparent">
<div class="container">
<div class="heading-block mb-4 border-bottom-0">
<h2 class="fw-normal ls-0 text-transform-none mb-0">Authors of the week</h2>
</div>
<div class="row align-items-center">
<div class="col-lg-3 col-sm-6">
<img src="demos/articles/images/author.jpg" alt="Image">
</div>
<div class="col-lg-4 col-sm-6 mt-3 mt-sm-0">
<div class="heading-block">
<h2 class="fw-bold ls-0 mb-0 font-body">Samuel Serif</h2>
<span class="text-muted">Writer, London</span>
</div>
<p class="mb-0">Progressively strategize just in time scenarios and compelling results. Intrinsicly parallel task extensive systems whereas distinctive catalysts for scenarios and compelling results change.</p>
</div>
<div class="col-lg-5 mt-5 mt-lg-0">
<h4 class="mb-3 fw-normal font-body">Popular Books of <a href="#">Samuel Serif</a></h4>
<div id="oc-images" class="owl-carousel image-carousel carousel-widget" data-margin="20" data-nav="true" data-pagi="true" data-items-xs="2" data-items-sm="3" data-items-md="3" data-items-lg="2" data-items-xl="2">
<div class="oc-item">
<a href="#"><img src="demos/articles/images/articles/1/1.png" alt="Image 1"></a>
</div>
<div class="oc-item">
<a href="#"><img src="demos/articles/images/articles/1/2.png" alt="Image 2"></a>
</div>
<div class="oc-item">
<a href="#"><img src="demos/articles/images/articles/2/1.png" alt="Image 3"></a>
</div>
<div class="oc-item">
<a href="#"><img src="demos/articles/images/articles/4/1.png" alt="Image 4"></a>
</div>
<div class="oc-item">
<a href="#"><img src="demos/articles/images/articles/6/1.png" alt="Image 5"></a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="section mb-0 p-md-0">
<div class="container">
<div class="row align-items-center justify-content-between">
<div class="col-lg-5 col-md-5 col-sm-6">
<div class="heading-block border-bottom-0">
<h2 class="fw-normal ls-0 text-transform-none mb-0 font-primary" style="font-size: 44px; line-height: 1.3">Available for your smartphone.</h2>
</div>
<p>Progressively strategize just in time scenarios and compelling results. Intrinsicly parallel task extensive systems whereas distinctive catalysts for scenarios and compelling results change.</p>
<div>
<a href="#"><img src="demos/articles/images/appstore.png" alt="Image" height="54" class="mt-3"></a>
<a href="#"><img src="demos/articles/images/googleplay.png" alt="Image" class="ms-xl-3 ms-lg-1 mt-3 ms-0 " height="54"></a>
</div>
</div>
<div class="col-lg-6 col-md-7 col-sm-6 mt-5 mt-sm-0">
<div class="d-none d-lg-flex">
<img src="demos/articles/images/iphone-1.png" class="fast" alt="Image" style="height: 600px" data-animate="fadeInDown">
<img src="demos/articles/images/iphone-2.png" class="fast" alt="Image" style="height: 600px" data-animate="fadeInUp">
</div>
<img src="demos/articles/images/iphone.png" alt="Image" class="d-block d-lg-none px-5 px-sm-0 p-md-5">
</div>
</div>
</div>
</div>
</div>
</section><!-- #content end -->
<!-- Footer
============================================= -->
<footer id="footer" class="border-0">
<div class="container">
<!-- Footer Widgets
============================================= -->
<div class="footer-widgets-wrap row">
<div class="col-md-4 col-sm-6">
<div class="widget">
<div class="d-flex align-items-center mb-4">
<img src="demos/articles/images/logo-footer.jpg" height="40" alt="Image">
<h4 class="text-transform-none ls-0 mb-0 font-body ms-2">canvas</h4>
</div>
<div class="d-flex">
<div class="pe-4 ps-1">
<i class="bi-building h3"></i>
</div>
<div class="flex-grow-1">
<address>
<abbr title="address"><strong>Headquarters:</strong><br></abbr>
795 Folsom Ave, Suite 600<br>
San Francisco, CA 94107<br>
</address>
</div>
</div>
<div class="d-flex">
<div class="pe-4 ps-1">
<i class="fa-solid fa-phone h3"></i>
</div>
<div class="flex-grow-1">
<div class="mb-4">
<abbr title="Phone Number"><strong>Phone:</strong></abbr> (1) 8547 632521<br>
<abbr title="Fax"><strong>Fax:</strong></abbr> (1) 11 4752 1433<br>
</div>
</div>
</div>
<div class="d-flex align-items-center">
<div class="pe-4 ps-1">
<i class="bi-envelope h3 mb-0"></i>
</div>
<div class="flex-grow-1">
<abbr title="Email Address"><strong>Email:</strong></abbr> [email protected]
</div>
</div>
<div class="mt-4">
<a href="https://facebook.com/semicolonweb" class="social-icon si-small rounded-circle text-light border-0 bg-facebook" title="Facebook" target="_blank">
<i class="fa-brands fa-facebook-f"></i>
<i class="fa-brands fa-facebook-f"></i>
</a>
<a href="https://twitter.com/__semicolon" class="social-icon ms-1 si-small rounded-circle text-light border-0 bg-twitter" title="Twitter" target="_blank">
<i class="fa-brands fa-twitter"></i>
<i class="fa-brands fa-twitter"></i>
</a>
<a href="#" class="social-icon ms-1 si-small rounded-circle text-light border-0 bg-github" title="Github">
<i class="fa-brands fa-github"></i>
<i class="fa-brands fa-github"></i>
</a>
<a href="#" class="social-icon ms-1 si-small rounded-circle text-light border-0 bg-pinterest" title="Pinterest">
<i class="fa-brands fa-pinterest-p"></i>
<i class="fa-brands fa-pinterest-p"></i>
</a>
<a href="#" class="social-icon ms-1 si-small rounded-circle text-light border-0 bg-forrst" title="Forrst">
<i class="fa-solid fa-tree"></i>
<i class="fa-solid fa-tree"></i>
</a>
</div>
</div>
</div>
<div class="col-md-4 col-sm-6 mt-5 mt-sm-0">
<div class="widget widget_links">
<div class="line mb-5 mt-2 d-block d-sm-none"></div>
<h4 class="font-body fw-bold ls-0">Popular Authors</h4>
<div class="posts-sm row col-mb-30" id="post-list-footer">
<div class="entry col-12">
<div class="grid-inner row align-items-center g-0">
<div class="col-auto">
<div class="entry-image">
<a href="#"><img src="demos/articles/images/authors/1.jpg" alt="Author"></a>
</div>
</div>
<div class="col ps-3">
<div class="entry-title">
<h4 class="font-body"><a href="#">Nathaneal Down</a></h4>
<small>Published 2,615 Books</small>
</div>
</div>
</div>
</div>
<div class="entry col-12">
<div class="grid-inner row align-items-center g-0">
<div class="col-auto">
<div class="entry-image">
<a href="#"><img src="demos/articles/images/authors/2.jpg" alt="Author"></a>
</div>
</div>
<div class="col ps-3">
<div class="entry-title">
<h4 class="font-body"><a href="#">Bailey Wonger</a></h4>
<small>Published 2,174 Books</small>
</div>
</div>
</div>
</div>
<div class="entry col-12">
<div class="grid-inner row align-items-center g-0">
<div class="col-auto">
<div class="entry-image">
<a href="#"><img src="demos/articles/images/authors/3.jpg" alt="Author"></a>
</div>
</div>
<div class="col ps-3">
<div class="entry-title">
<h4 class="font-body"><a href="#">Hanson Deck</a></h4>
<small>Published 1,187 Books</small>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-4 col-sm-6 mt-5 mt-md-0">
<div id="q-contact" class="widget quick-contact-widget form-widget">
<div class="line mb-5 mt-2 d-block d-md-none"></div>
<h4 class="highlight-me font-body fw-bold ls-0">Contact Us</h4>
<div class="form-result"></div>
<form id="quick-contact-form" name="quick-contact-form" action="include/form.php" method="post" class="quick-contact-form mb-0">
<div class="form-process">
<div class="css3-spinner">
<div class="css3-spinner-scaler"></div>
</div>
</div>
<input type="text" class="required form-control border-form-control mb-2" id="quick-contact-form-name" name="quick-contact-form-name" value="" placeholder="Full Name">
<input type="text" class="required form-control border-form-control email mb-2" id="quick-contact-form-email" name="quick-contact-form-email" value="" placeholder="Email Address">
<textarea class="required form-control border-form-control mb-2 short-textarea" id="quick-contact-form-message" name="quick-contact-form-message" rows="4" cols="30" placeholder="Message"></textarea>
<input type="text" class="d-none" id="quick-contact-form-botcheck" name="quick-contact-form-botcheck" value="">
<input type="hidden" name="prefix" value="quick-contact-form-">
<button type="submit" id="quick-contact-form-submit" name="quick-contact-form-submit" class="button button-small button-black text-transform-none ls-0 mt-3 ms-0" value="submit">Send Email</button>
</form>
</div>
</div>
</div><!-- .footer-widgets-wrap end -->
</div>
<div class="line m-0"></div>
<!-- Copyrights
============================================= -->
<div id="copyrights">
<div class="container">
<div class="row align-items-center">
<div class="col-md-6 text-center text-md-start">
Copyrights © 2023 All Rights Reserved by Canvas Inc.
</div>
<div class="col-md-6 mt-4 mt-md-0">
<div class="d-flex justify-content-center justify-content-md-end">
<a href="#" class="social-icon si-small border-transparent h-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-transparent h-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-transparent h-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-transparent h-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-transparent h-bg-vimeo">
<i class="fa-brands fa-vimeo-v"></i>
<i class="fa-brands fa-vimeo-v"></i>
</a>
<a href="#" class="social-icon si-small border-transparent h-bg-github">
<i class="fa-brands fa-github"></i>
<i class="fa-brands fa-github"></i>
</a>
<a href="#" class="social-icon si-small border-transparent h-bg-yahoo">
<i class="fa-brands fa-yahoo"></i>
<i class="fa-brands fa-yahoo"></i>
</a>
<a href="#" class="social-icon si-small border-transparent h-bg-linkedin">
<i class="fa-brands fa-linkedin"></i>
<i class="fa-brands fa-linkedin"></i>
</a>
</div>
</div>
</div>
</div>
</div><!-- #copyrights end -->
</footer><!-- #footer end -->
</div><!-- #wrapper end -->
<!-- Switcher
============================================= -->
<button type="button" class="btn btn-dark body-scheme-toggle mode-switcher" data-bodyclass-toggle="dark" data-add-class="btn-warning" data-remove-class="btn-dark" data-add-html="<i class='bi-brightness-high align-middle'></i><span class='visually-hidden'>Light Mode</span>" data-remove-html="<i class='bi-moon-stars align-middle'></i><span class='visually-hidden'>Dark Mode</span>"><span class="visually-hidden">Dark Toggle</span></button>
<!-- Go To Top
============================================= -->
<div id="gotoTop" class="uil uil-angle-up"></div>
<!-- JavaScripts
============================================= -->
<script src="js/functions.js"></script>
<script>
window.addEventListener( 'pluginSwiperReady', () => {
var swiper = new Swiper('.swiper-scroller', {
slidesPerView: 2,
spaceBetween: 50,
freeMode: true,
grabCursor: true,
navigation: {
nextEl: '.slider-arrow-right-1',
prevEl: '.slider-arrow-left-1',
},
scrollbar: {
el: '.swiper-scrollbar',
},
mousewheel: true,
breakpoints: {
768: {
spaceBetween: 20,
},
576: {
spaceBetween: 15,
}
}
});
});
</script>
</body>
</html>