0% found this document useful (0 votes)
28 views20 pages

Index

Uploaded by

codelyctal
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
28 views20 pages

Index

Uploaded by

codelyctal
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 20

<!

DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>Index - Restaurantly Bootstrap Template</title>
<meta name="description" content="">
<meta name="keywords" content="">

<!-- Favicons -->


<link href="assets/img/favicon.png" rel="icon">
<link href="assets/img/apple-touch-icon.png" rel="apple-touch-icon">

<!-- Fonts -->


<link href="https://fonts.googleapis.com" rel="preconnect">
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link href="https://fonts.googleapis.com/css2?
family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500
;1,700;1,900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,8
00;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Playfair+Disp
lay:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,500;1,600;1,700;1,800;1,9
00&display=swap" rel="stylesheet">

<!-- Vendor CSS Files -->


<link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
<link href="assets/vendor/aos/aos.css" rel="stylesheet">
<link href="assets/vendor/glightbox/css/glightbox.min.css" rel="stylesheet">
<link href="assets/vendor/swiper/swiper-bundle.min.css" rel="stylesheet">

<!-- Main CSS File -->


<link href="assets/css/main.css" rel="stylesheet">

<!-- =======================================================
* Template Name: Restaurantly
* Template URL: https://bootstrapmade.com/restaurantly-restaurant-template/
* Updated: Aug 07 2024 with Bootstrap v5.3.3
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
======================================================== -->
</head>

<body class="index-page">

<header id="header" class="header fixed-top">

<div class="topbar d-flex align-items-center">


<div class="container d-flex justify-content-center justify-content-md-
between">
<div class="contact-info d-flex align-items-center">
<i class="bi bi-envelope d-flex align-items-center"><a
href="mailto:[email protected]">[email protected]</a></i>
<i class="bi bi-phone d-flex align-items-center ms-4"><span>+1 5589 55488
55</span></i>
</div>
<div class="languages d-none d-md-flex align-items-center">
<ul>
<li>En</li>
<li><a href="#">De</a></li>
</ul>
</div>
</div>
</div><!-- End Top Bar -->

<div class="branding d-flex align-items-cente">

<div class="container position-relative d-flex align-items-center justify-


content-between">
<a href="index.html" class="logo d-flex align-items-center me-auto me-xl-
0">
<!-- Uncomment the line below if you also wish to use an image logo -->
<!-- <img src="assets/img/logo.png" alt=""> -->
<h1 class="sitename">Restaurantly</h1>
</a>

<nav id="navmenu" class="navmenu">


<ul>
<li><a href="#hero" class="active">Home<br></a></li>
<li><a href="#about">About</a></li>
<li><a href="#menu">Menu</a></li>
<li><a href="#specials">Specials</a></li>
<li><a href="#events">Events</a></li>
<li><a href="#chefs">Chefs</a></li>
<li><a href="#gallery">Gallery</a></li>
<li class="dropdown"><a href="#"><span>Dropdown</span> <i class="bi bi-
chevron-down toggle-dropdown"></i></a>
<ul>
<li><a href="#">Dropdown 1</a></li>
<li class="dropdown"><a href="#"><span>Deep Dropdown</span> <i
class="bi bi-chevron-down toggle-dropdown"></i></a>
<ul>
<li><a href="#">Deep Dropdown 1</a></li>
<li><a href="#">Deep Dropdown 2</a></li>
<li><a href="#">Deep Dropdown 3</a></li>
<li><a href="#">Deep Dropdown 4</a></li>
<li><a href="#">Deep Dropdown 5</a></li>
</ul>
</li>
<li><a href="#">Dropdown 2</a></li>
<li><a href="#">Dropdown 3</a></li>
<li><a href="#">Dropdown 4</a></li>
</ul>
</li>
<li><a href="#contact">Contact</a></li>
</ul>
<i class="mobile-nav-toggle d-xl-none bi bi-list"></i>
</nav>

<a class="btn-book-a-table d-none d-xl-block" href="#book-a-table">Book a


Table</a>

</div>

</div>

</header>
<main class="main">

<!-- Hero Section -->


<section id="hero" class="hero section dark-background">

<img src="assets/img/hero-bg.jpg" alt="" data-aos="fade-in">

<div class="container">
<div class="row">
<div class="col-lg-8 d-flex flex-column align-items-center align-items-
lg-start">
<h2 data-aos="fade-up" data-aos-delay="100">Welcome to
<span>Restaurantly</span></h2>
<p data-aos="fade-up" data-aos-delay="200">Delivering great food for
more than 18 years!</p>
<div class="d-flex mt-4" data-aos="fade-up" data-aos-delay="300">
<a href="#menu" class="cta-btn">Our Menu</a>
<a href="#book-a-table" class="cta-btn">Book a Table</a>
</div>
</div>
<div class="col-lg-4 d-flex align-items-center justify-content-center mt-
5 mt-lg-0">
<a href="https://www.youtube.com/watch?v=Y7f98aduVJ8" class="glightbox
pulsating-play-btn"></a>
</div>
</div>
</div>

</section><!-- /Hero Section -->

<!-- About Section -->


<section id="about" class="about section">

<div class="container" data-aos="fade-up" data-aos-delay="100">

<div class="row gy-4">


<div class="col-lg-6 order-1 order-lg-2">
<img src="assets/img/about.jpg" class="img-fluid about-img" alt="">
</div>
<div class="col-lg-6 order-2 order-lg-1 content">
<h3>Voluptatem dignissimos provident</h3>
<p class="fst-italic">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
eiusmod tempor incididunt ut labore et dolore
magna aliqua.
</p>
<ul>
<li><i class="bi bi-check2-all"></i> <span>Ullamco laboris nisi ut
aliquip ex ea commodo consequat.</span></li>
<li><i class="bi bi-check2-all"></i> <span>Duis aute irure dolor in
reprehenderit in voluptate velit.</span></li>
<li><i class="bi bi-check2-all"></i> <span>Ullamco laboris nisi ut
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate trideta storacalaperda mastiro dolore eu fugiat nulla
pariatur.</span></li>
</ul>
<p>
Ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
irure dolor in reprehenderit in voluptate
velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non proident
</p>
</div>
</div>

</div>

</section><!-- /About Section -->

<!-- Why Us Section -->


<section id="why-us" class="why-us section">

<!-- Section Title -->


<div class="container section-title" data-aos="fade-up">
<h2>WHY US</h2>
<p>Why Choose Our Restaurant</p>
</div><!-- End Section Title -->

<div class="container">

<div class="row gy-4">

<div class="col-lg-4" data-aos="fade-up" data-aos-delay="100">


<div class="card-item">
<span>01</span>
<h4><a href="" class="stretched-link">Lorem Ipsum</a></h4>
<p>Ulamco laboris nisi ut aliquip ex ea commodo consequat. Et
consectetur ducimus vero placeat</p>
</div>
</div><!-- Card Item -->

<div class="col-lg-4" data-aos="fade-up" data-aos-delay="200">


<div class="card-item">
<span>02</span>
<h4><a href="" class="stretched-link">Repellat Nihil</a></h4>
<p>Dolorem est fugiat occaecati voluptate velit esse. Dicta veritatis
dolor quod et vel dire leno para dest</p>
</div>
</div><!-- Card Item -->

<div class="col-lg-4" data-aos="fade-up" data-aos-delay="300">


<div class="card-item">
<span>03</span>
<h4><a href="" class="stretched-link">Ad ad velit qui</a></h4>
<p>Molestiae officiis omnis illo asperiores. Aut doloribus vitae sunt
debitis quo vel nam quis</p>
</div>
</div><!-- Card Item -->

</div>

</div>

</section><!-- /Why Us Section -->

<!-- Menu Section -->


<section id="menu" class="menu section">
<!-- Section Title -->
<div class="container section-title" data-aos="fade-up">
<h2>Menu</h2>
<p>Check Our Tasty Menu</p>
</div><!-- End Section Title -->

<div class="container isotope-layout" data-default-filter="*" data-


layout="masonry" data-sort="original-order">

<div class="row" data-aos="fade-up" data-aos-delay="100">


<div class="col-lg-12 d-flex justify-content-center">
<ul class="menu-filters isotope-filters">
<li data-filter="*" class="filter-active">All</li>
<li data-filter=".filter-starters">Starters</li>
<li data-filter=".filter-salads">Salads</li>
<li data-filter=".filter-specialty">Specialty</li>
</ul>
</div>
</div><!-- Menu Filters -->

<div class="row isotope-container" data-aos="fade-up" data-aos-delay="200">

<div class="col-lg-6 menu-item isotope-item filter-starters">


<img src="assets/img/menu/lobster-bisque.jpg" class="menu-img" alt="">
<div class="menu-content">
<a href="#">Lobster Bisque</a><span>$5.95</span>
</div>
<div class="menu-ingredients">
Lorem, deren, trataro, filede, nerada
</div>
</div><!-- Menu Item -->

<div class="col-lg-6 menu-item isotope-item filter-specialty">


<img src="assets/img/menu/bread-barrel.jpg" class="menu-img" alt="">
<div class="menu-content">
<a href="#">Bread Barrel</a><span>$6.95</span>
</div>
<div class="menu-ingredients">
Lorem, deren, trataro, filede, nerada
</div>
</div><!-- Menu Item -->

<div class="col-lg-6 menu-item isotope-item filter-starters">


<img src="assets/img/menu/cake.jpg" class="menu-img" alt="">
<div class="menu-content">
<a href="#">Crab Cake</a><span>$7.95</span>
</div>
<div class="menu-ingredients">
A delicate crab cake served on a toasted roll with lettuce and tartar
sauce
</div>
</div><!-- Menu Item -->

<div class="col-lg-6 menu-item isotope-item filter-salads">


<img src="assets/img/menu/caesar.jpg" class="menu-img" alt="">
<div class="menu-content">
<a href="#">Caesar Selections</a><span>$8.95</span>
</div>
<div class="menu-ingredients">
Lorem, deren, trataro, filede, nerada
</div>
</div><!-- Menu Item -->

<div class="col-lg-6 menu-item isotope-item filter-specialty">


<img src="assets/img/menu/tuscan-grilled.jpg" class="menu-img" alt="">
<div class="menu-content">
<a href="#">Tuscan Grilled</a><span>$9.95</span>
</div>
<div class="menu-ingredients">
Grilled chicken with provolone, artichoke hearts, and roasted red
pesto
</div>
</div><!-- Menu Item -->

<div class="col-lg-6 menu-item isotope-item filter-starters">


<img src="assets/img/menu/mozzarella.jpg" class="menu-img" alt="">
<div class="menu-content">
<a href="#">Mozzarella Stick</a><span>$4.95</span>
</div>
<div class="menu-ingredients">
Lorem, deren, trataro, filede, nerada
</div>
</div><!-- Menu Item -->

<div class="col-lg-6 menu-item isotope-item filter-salads">


<img src="assets/img/menu/greek-salad.jpg" class="menu-img" alt="">
<div class="menu-content">
<a href="#">Greek Salad</a><span>$9.95</span>
</div>
<div class="menu-ingredients">
Fresh spinach, crisp romaine, tomatoes, and Greek olives
</div>
</div><!-- Menu Item -->

<div class="col-lg-6 menu-item isotope-item filter-salads">


<img src="assets/img/menu/spinach-salad.jpg" class="menu-img" alt="">
<div class="menu-content">
<a href="#">Spinach Salad</a><span>$9.95</span>
</div>
<div class="menu-ingredients">
Fresh spinach with mushrooms, hard boiled egg, and warm bacon
vinaigrette
</div>
</div><!-- Menu Item -->

<div class="col-lg-6 menu-item isotope-item filter-specialty">


<img src="assets/img/menu/lobster-roll.jpg" class="menu-img" alt="">
<div class="menu-content">
<a href="#">Lobster Roll</a><span>$12.95</span>
</div>
<div class="menu-ingredients">
Plump lobster meat, mayo and crisp lettuce on a toasted bulky roll
</div>
</div><!-- Menu Item -->

</div><!-- Menu Container -->

</div>
</section><!-- /Menu Section -->

<!-- Specials Section -->


<section id="specials" class="specials section">

<!-- Section Title -->


<div class="container section-title" data-aos="fade-up">
<h2>Specials</h2>
<p>Check Our Specials</p>
</div><!-- End Section Title -->

<div class="container" data-aos="fade-up" data-aos-delay="100">

<div class="row">
<div class="col-lg-3">
<ul class="nav nav-tabs flex-column">
<li class="nav-item">
<a class="nav-link active show" data-bs-toggle="tab"
href="#specials-tab-1">Modi sit est</a>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="tab" href="#specials-tab-
2">Unde praesentium sed</a>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="tab" href="#specials-tab-
3">Pariatur explicabo vel</a>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="tab" href="#specials-tab-
4">Nostrum qui quasi</a>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="tab" href="#specials-tab-
5">Iusto ut expedita aut</a>
</li>
</ul>
</div>
<div class="col-lg-9 mt-4 mt-lg-0">
<div class="tab-content">
<div class="tab-pane active show" id="specials-tab-1">
<div class="row">
<div class="col-lg-8 details order-2 order-lg-1">
<h3>Architecto ut aperiam autem id</h3>
<p class="fst-italic">Qui laudantium consequatur laborum sit
qui ad sapiente dila parde sonata raqer a videna mareta paulona marka</p>
<p>Et nobis maiores eius. Voluptatibus ut enim blanditiis atque
harum sint. Laborum eos ipsum ipsa odit magni. Incidunt hic ut molestiae aut qui.
Est repellat minima eveniet eius et quis magni nihil. Consequatur dolorem quaerat
quos qui similique accusamus nostrum rem vero</p>
</div>
<div class="col-lg-4 text-center order-1 order-lg-2">
<img src="assets/img/specials-1.png" alt="" class="img-fluid">
</div>
</div>
</div>
<div class="tab-pane" id="specials-tab-2">
<div class="row">
<div class="col-lg-8 details order-2 order-lg-1">
<h3>Et blanditiis nemo veritatis excepturi</h3>
<p class="fst-italic">Qui laudantium consequatur laborum sit
qui ad sapiente dila parde sonata raqer a videna mareta paulona marka</p>
<p>Ea ipsum voluptatem consequatur quis est. Illum error ullam
omnis quia et reiciendis sunt sunt est. Non aliquid repellendus itaque accusamus
eius et velit ipsa voluptates. Optio nesciunt eaque beatae accusamus lerode pakto
madirna desera vafle de nideran pal</p>
</div>
<div class="col-lg-4 text-center order-1 order-lg-2">
<img src="assets/img/specials-2.png" alt="" class="img-fluid">
</div>
</div>
</div>
<div class="tab-pane" id="specials-tab-3">
<div class="row">
<div class="col-lg-8 details order-2 order-lg-1">
<h3>Impedit facilis occaecati odio neque aperiam sit</h3>
<p class="fst-italic">Eos voluptatibus quo. Odio similique
illum id quidem non enim fuga. Qui natus non sunt dicta dolor et. In asperiores
velit quaerat perferendis aut</p>
<p>Iure officiis odit rerum. Harum sequi eum illum corrupti
culpa veritatis quisquam. Neque necessitatibus illo rerum eum ut. Commodi ipsam
minima molestiae sed laboriosam a iste odio. Earum odit nesciunt fugiat sit ullam.
Soluta et harum voluptatem optio quae</p>
</div>
<div class="col-lg-4 text-center order-1 order-lg-2">
<img src="assets/img/specials-3.png" alt="" class="img-fluid">
</div>
</div>
</div>
<div class="tab-pane" id="specials-tab-4">
<div class="row">
<div class="col-lg-8 details order-2 order-lg-1">
<h3>Fuga dolores inventore laboriosam ut est accusamus
laboriosam dolore</h3>
<p class="fst-italic">Totam aperiam accusamus. Repellat
consequuntur iure voluptas iure porro quis delectus</p>
<p>Eaque consequuntur consequuntur libero expedita in voluptas.
Nostrum ipsam necessitatibus aliquam fugiat debitis quis velit. Eum ex maxime error
in consequatur corporis atque. Eligendi asperiores sed qui veritatis aperiam quia a
laborum inventore</p>
</div>
<div class="col-lg-4 text-center order-1 order-lg-2">
<img src="assets/img/specials-4.png" alt="" class="img-fluid">
</div>
</div>
</div>
<div class="tab-pane" id="specials-tab-5">
<div class="row">
<div class="col-lg-8 details order-2 order-lg-1">
<h3>Est eveniet ipsam sindera pad rone matrelat sando reda</h3>
<p class="fst-italic">Omnis blanditiis saepe eos autem qui sunt
debitis porro quia.</p>
<p>Exercitationem nostrum omnis. Ut reiciendis repudiandae
minus. Omnis recusandae ut non quam ut quod eius qui. Ipsum quia odit vero atque
qui quibusdam amet. Occaecati sed est sint aut vitae molestiae voluptate vel</p>
</div>
<div class="col-lg-4 text-center order-1 order-lg-2">
<img src="assets/img/specials-5.png" alt="" class="img-fluid">
</div>
</div>
</div>
</div>
</div>
</div>

</div>

</section><!-- /Specials Section -->

<!-- Events Section -->


<section id="events" class="events section">

<img class="slider-bg" src="assets/img/events-bg.jpg" alt="" data-aos="fade-


in">

<div class="container">

<div class="swiper init-swiper" data-aos="fade-up" data-aos-delay="100">


<script type="application/json" class="swiper-config">
{
"loop": true,
"speed": 600,
"autoplay": {
"delay": 5000
},
"slidesPerView": "auto",
"pagination": {
"el": ".swiper-pagination",
"type": "bullets",
"clickable": true
}
}
</script>
<div class="swiper-wrapper">

<div class="swiper-slide">
<div class="row gy-4 event-item">
<div class="col-lg-6">
<img src="assets/img/events-slider/events-slider-1.jpg"
class="img-fluid" alt="">
</div>
<div class="col-lg-6 pt-4 pt-lg-0 content">
<h3>Birthday Parties</h3>
<div class="price">
<p><span>$189</span></p>
</div>
<p class="fst-italic">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
eiusmod tempor incididunt ut labore et dolore
magna aliqua.
</p>
<ul>
<li><i class="bi bi-check2-circle"></i> <span>Ullamco laboris
nisi ut aliquip ex ea commodo consequat.</span></li>
<li><i class="bi bi-check2-circle"></i> <span>Duis aute irure
dolor in reprehenderit in voluptate velit.</span></li>
<li><i class="bi bi-check2-circle"></i> <span>Ullamco laboris
nisi ut aliquip ex ea commodo consequat.</span></li>
</ul>
<p>
Ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis
aute irure dolor in reprehenderit in voluptate
velit esse cillum dolore eu fugiat nulla pariatur
</p>
</div>
</div>
</div><!-- End Slider item -->

<div class="swiper-slide">
<div class="row gy-4 event-item">
<div class="col-lg-6">
<img src="assets/img/events-slider/events-slider-2.jpg"
class="img-fluid" alt="">
</div>
<div class="col-lg-6 pt-4 pt-lg-0 content">
<h3>Private Parties</h3>
<div class="price">
<p><span>$290</span></p>
</div>
<p class="fst-italic">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
eiusmod tempor incididunt ut labore et dolore
magna aliqua.
</p>
<ul>
<li><i class="bi bi-check2-circle"></i> <span>Ullamco laboris
nisi ut aliquip ex ea commodo consequat.</span></li>
<li><i class="bi bi-check2-circle"></i> <span>Duis aute irure
dolor in reprehenderit in voluptate velit.</span></li>
<li><i class="bi bi-check2-circle"></i> <span>Ullamco laboris
nisi ut aliquip ex ea commodo consequat.</span></li>
</ul>
<p>
Ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis
aute irure dolor in reprehenderit in voluptate
velit esse cillum dolore eu fugiat nulla pariatur
</p>
</div>
</div>
</div><!-- End Slider item -->

<div class="swiper-slide">
<div class="row gy-4 event-item">
<div class="col-lg-6">
<img src="assets/img/events-slider/events-slider-3.jpg"
class="img-fluid" alt="">
</div>
<div class="col-lg-6 pt-4 pt-lg-0 content">
<h3>Custom Parties</h3>
<div class="price">
<p><span>$99</span></p>
</div>
<p class="fst-italic">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
eiusmod tempor incididunt ut labore et dolore
magna aliqua.
</p>
<ul>
<li><i class="bi bi-check2-circle"></i> <span>Ullamco laboris
nisi ut aliquip ex ea commodo consequat.</span></li>
<li><i class="bi bi-check2-circle"></i> <span>Duis aute irure
dolor in reprehenderit in voluptate velit.</span></li>
<li><i class="bi bi-check2-circle"></i> <span>Ullamco laboris
nisi ut aliquip ex ea commodo consequat.</span></li>
</ul>
<p>
Ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis
aute irure dolor in reprehenderit in voluptate
velit esse cillum dolore eu fugiat nulla pariatur
</p>
</div>
</div>
</div><!-- End Slider item -->

</div>
<div class="swiper-pagination"></div>
</div>

</div>

</section><!-- /Events Section -->

<!-- Book A Table Section -->


<section id="book-a-table" class="book-a-table section">

<!-- Section Title -->


<div class="container section-title" data-aos="fade-up">
<h2>RESERVATION</h2>
<p>Book a Table</p>
</div><!-- End Section Title -->

<div class="container" data-aos="fade-up" data-aos-delay="100">

<form action="forms/book-a-table.php" method="post" role="form" class="php-


email-form">
<div class="row gy-4">
<div class="col-lg-4 col-md-6">
<input type="text" name="name" class="form-control" id="name"
placeholder="Your Name" required="">
</div>
<div class="col-lg-4 col-md-6">
<input type="email" class="form-control" name="email" id="email"
placeholder="Your Email" required="">
</div>
<div class="col-lg-4 col-md-6">
<input type="text" class="form-control" name="phone" id="phone"
placeholder="Your Phone" required="">
</div>
<div class="col-lg-4 col-md-6">
<input type="date" name="date" class="form-control" id="date"
placeholder="Date" required="">
</div>
<div class="col-lg-4 col-md-6">
<input type="time" class="form-control" name="time" id="time"
placeholder="Time" required="">
</div>
<div class="col-lg-4 col-md-6">
<input type="number" class="form-control" name="people" id="people"
placeholder="# of people" required="">
</div>
</div>

<div class="form-group mt-3">


<textarea class="form-control" name="message" rows="5"
placeholder="Message"></textarea>
</div>

<div class="text-center mt-3">


<div class="loading">Loading</div>
<div class="error-message"></div>
<div class="sent-message">Your booking request was sent. We will call
back or send an Email to confirm your reservation. Thank you!</div>
<button type="submit">Book a Table</button>
</div>
</form><!-- End Reservation Form -->

</div>

</section><!-- /Book A Table Section -->

<!-- Testimonials Section -->


<section id="testimonials" class="testimonials section">

<!-- Section Title -->


<div class="container section-title" data-aos="fade-up">
<h2>Testimonials</h2>
<p>What they're saying about us</p>
</div><!-- End Section Title -->

<div class="container" data-aos="fade-up" data-aos-delay="100">

<div class="swiper init-swiper" data-speed="600" data-delay="5000" data-


breakpoints="{ &quot;320&quot;: { &quot;slidesPerView&quot;: 1,
&quot;spaceBetween&quot;: 40 }, &quot;1200&quot;: { &quot;slidesPerView&quot;: 3,
&quot;spaceBetween&quot;: 40 } }">
<script type="application/json" class="swiper-config">
{
"loop": true,
"speed": 600,
"autoplay": {
"delay": 5000
},
"slidesPerView": "auto",
"pagination": {
"el": ".swiper-pagination",
"type": "bullets",
"clickable": true
},
"breakpoints": {
"320": {
"slidesPerView": 1,
"spaceBetween": 40
},
"1200": {
"slidesPerView": 3,
"spaceBetween": 20
}
}
}
</script>
<div class="swiper-wrapper">

<div class="swiper-slide">
<div class="testimonial-item" "="">
<p>
<i class=" bi bi-quote quote-icon-left"></i>
<span>Proin iaculis purus consequat sem cure digni ssim donec
porttitora entum suscipit rhoncus. Accusantium quam, ultricies eget id, aliquam
eget nibh et. Maecen aliquam, risus at semper.</span>
<i class="bi bi-quote quote-icon-right"></i>
</p>
<img src="assets/img/testimonials/testimonials-1.jpg"
class="testimonial-img" alt="">
<h3>Saul Goodman</h3>
<h4>Ceo &amp; Founder</h4>
</div>
</div><!-- End testimonial item -->

<div class="swiper-slide">
<div class="testimonial-item">
<p>
<i class="bi bi-quote quote-icon-left"></i>
<span>Export tempor illum tamen malis malis eram quae irure esse
labore quem cillum quid malis quorum velit fore eram velit sunt aliqua noster
fugiat irure amet legam anim culpa.</span>
<i class="bi bi-quote quote-icon-right"></i>
</p>
<img src="assets/img/testimonials/testimonials-2.jpg"
class="testimonial-img" alt="">
<h3>Sara Wilsson</h3>
<h4>Designer</h4>
</div>
</div><!-- End testimonial item -->

<div class="swiper-slide">
<div class="testimonial-item">
<p>
<i class="bi bi-quote quote-icon-left"></i>
<span>Enim nisi quem export duis labore cillum quae magna enim
sint quorum nulla quem veniam duis minim tempor labore quem eram duis noster aute
amet eram fore quis sint minim.</span>
<i class="bi bi-quote quote-icon-right"></i>
</p>
<img src="assets/img/testimonials/testimonials-3.jpg"
class="testimonial-img" alt="">
<h3>Jena Karlis</h3>
<h4>Store Owner</h4>
</div>
</div><!-- End testimonial item -->

<div class="swiper-slide">
<div class="testimonial-item">
<p>
<i class="bi bi-quote quote-icon-left"></i>
<span>Fugiat enim eram quae cillum dolore dolor amet nulla culpa
multos export minim fugiat dolor enim duis veniam ipsum anim magna sunt elit fore
quem dolore labore illum veniam.</span>
<i class="bi bi-quote quote-icon-right"></i>
</p>
<img src="assets/img/testimonials/testimonials-4.jpg"
class="testimonial-img" alt="">
<h3>Matt Brandon</h3>
<h4>Freelancer</h4>
</div>
</div><!-- End testimonial item -->

<div class="swiper-slide">
<div class="testimonial-item">
<p>
<i class="bi bi-quote quote-icon-left"></i>
<span>Quis quorum aliqua sint quem legam fore sunt eram irure
aliqua veniam tempor noster veniam sunt culpa nulla illum cillum fugiat legam esse
veniam culpa fore nisi cillum quid.</span>
<i class="bi bi-quote quote-icon-right"></i>
</p>
<img src="assets/img/testimonials/testimonials-5.jpg"
class="testimonial-img" alt="">
<h3>John Larson</h3>
<h4>Entrepreneur</h4>
</div>
</div><!-- End testimonial item -->

</div>
<div class="swiper-pagination"></div>
</div>

</div>

</section><!-- /Testimonials Section -->

<!-- Gallery Section -->


<section id="gallery" class="gallery section">

<!-- Section Title -->


<div class="container section-title" data-aos="fade-up">
<h2>Gallery</h2>
<p>Some photos from Our Restaurant</p>
</div><!-- End Section Title -->

<div class="container-fluid" data-aos="fade-up" data-aos-delay="100">

<div class="row g-0">

<div class="col-lg-3 col-md-4">


<div class="gallery-item">
<a href="assets/img/gallery/gallery-1.jpg" class="glightbox" data-
gallery="images-gallery">
<img src="assets/img/gallery/gallery-1.jpg" alt="" class="img-
fluid">
</a>
</div>
</div><!-- End Gallery Item -->

<div class="col-lg-3 col-md-4">


<div class="gallery-item">
<a href="assets/img/gallery/gallery-2.jpg" class="glightbox" data-
gallery="images-gallery">
<img src="assets/img/gallery/gallery-2.jpg" alt="" class="img-
fluid">
</a>
</div>
</div><!-- End Gallery Item -->

<div class="col-lg-3 col-md-4">


<div class="gallery-item">
<a href="assets/img/gallery/gallery-3.jpg" class="glightbox" data-
gallery="images-gallery">
<img src="assets/img/gallery/gallery-3.jpg" alt="" class="img-
fluid">
</a>
</div>
</div><!-- End Gallery Item -->

<div class="col-lg-3 col-md-4">


<div class="gallery-item">
<a href="assets/img/gallery/gallery-4.jpg" class="glightbox" data-
gallery="images-gallery">
<img src="assets/img/gallery/gallery-4.jpg" alt="" class="img-
fluid">
</a>
</div>
</div><!-- End Gallery Item -->

<div class="col-lg-3 col-md-4">


<div class="gallery-item">
<a href="assets/img/gallery/gallery-5.jpg" class="glightbox" data-
gallery="images-gallery">
<img src="assets/img/gallery/gallery-5.jpg" alt="" class="img-
fluid">
</a>
</div>
</div><!-- End Gallery Item -->

<div class="col-lg-3 col-md-4">


<div class="gallery-item">
<a href="assets/img/gallery/gallery-6.jpg" class="glightbox" data-
gallery="images-gallery">
<img src="assets/img/gallery/gallery-6.jpg" alt="" class="img-
fluid">
</a>
</div>
</div><!-- End Gallery Item -->

<div class="col-lg-3 col-md-4">


<div class="gallery-item">
<a href="assets/img/gallery/gallery-7.jpg" class="glightbox" data-
gallery="images-gallery">
<img src="assets/img/gallery/gallery-7.jpg" alt="" class="img-
fluid">
</a>
</div>
</div><!-- End Gallery Item -->

<div class="col-lg-3 col-md-4">


<div class="gallery-item">
<a href="assets/img/gallery/gallery-8.jpg" class="glightbox" data-
gallery="images-gallery">
<img src="assets/img/gallery/gallery-8.jpg" alt="" class="img-
fluid">
</a>
</div>
</div><!-- End Gallery Item -->

</div>

</div>

</section><!-- /Gallery Section -->

<!-- Chefs Section -->


<section id="chefs" class="chefs section">

<!-- Section Title -->


<div class="container section-title" data-aos="fade-up">
<h2>Team</h2>
<p>Necessitatibus eius consequatur</p>
</div><!-- End Section Title -->

<div class="container">

<div class="row gy-4">

<div class="col-lg-4" data-aos="fade-up" data-aos-delay="100">


<div class="member">
<img src="assets/img/chefs/chefs-1.jpg" class="img-fluid" alt="">
<div class="member-info">
<div class="member-info-content">
<h4>Walter White</h4>
<span>Master Chef</span>
</div>
<div class="social">
<a href=""><i class="bi bi-twitter-x"></i></a>
<a href=""><i class="bi bi-facebook"></i></a>
<a href=""><i class="bi bi-instagram"></i></a>
<a href=""><i class="bi bi-linkedin"></i></a>
</div>
</div>
</div>
</div><!-- End Team Member -->

<div class="col-lg-4" data-aos="fade-up" data-aos-delay="200">


<div class="member">
<img src="assets/img/chefs/chefs-2.jpg" class="img-fluid" alt="">
<div class="member-info">
<div class="member-info-content">
<h4>Sarah Jhonson</h4>
<span>Patissier</span>
</div>
<div class="social">
<a href=""><i class="bi bi-twitter-x"></i></a>
<a href=""><i class="bi bi-facebook"></i></a>
<a href=""><i class="bi bi-instagram"></i></a>
<a href=""><i class="bi bi-linkedin"></i></a>
</div>
</div>
</div>
</div><!-- End Team Member -->

<div class="col-lg-4" data-aos="fade-up" data-aos-delay="300">


<div class="member">
<img src="assets/img/chefs/chefs-3.jpg" class="img-fluid" alt="">
<div class="member-info">
<div class="member-info-content">
<h4>William Anderson</h4>
<span>Cook</span>
</div>
<div class="social">
<a href=""><i class="bi bi-twitter-x"></i></a>
<a href=""><i class="bi bi-facebook"></i></a>
<a href=""><i class="bi bi-instagram"></i></a>
<a href=""><i class="bi bi-linkedin"></i></a>
</div>
</div>
</div>
</div><!-- End Team Member -->

</div>

</div>

</section><!-- /Chefs Section -->

<!-- Contact Section -->


<section id="contact" class="contact section">

<!-- Section Title -->


<div class="container section-title" data-aos="fade-up">
<h2>Contact</h2>
<p>Contact Us</p>
</div><!-- End Section Title -->

<div class="mb-5" data-aos="fade-up" data-aos-delay="200">


<iframe style="border:0; width: 100%; height: 400px;"
src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d48389.78314118045!2d-
74.006138!3d40.710059!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89c25a22a3bda30d
%3A0xb89d1fe6bc499443!2sDowntown%20Conference%20Center!5e0!3m2!1sen!2sus!
4v1676961268712!5m2!1sen!2sus" frameborder="0" allowfullscreen="" loading="lazy"
referrerpolicy="no-referrer-when-downgrade"></iframe>
</div><!-- End Google Maps -->

<div class="container" data-aos="fade-up" data-aos-delay="100">

<div class="row gy-4">

<div class="col-lg-4">
<div class="info-item d-flex" data-aos="fade-up" data-aos-delay="300">
<i class="bi bi-geo-alt flex-shrink-0"></i>
<div>
<h3>Location</h3>
<p>A108 Adam Street, New York, NY 535022</p>
</div>
</div><!-- End Info Item -->

<div class="info-item d-flex" data-aos="fade-up" data-aos-delay="400">


<i class="bi bi-telephone flex-shrink-0"></i>
<div>
<h3>Open Hours</h3>
<p>Monday-Saturday:<br>11:00 AM - 2300 PM</p>
</div>
</div><!-- End Info Item -->

<div class="info-item d-flex" data-aos="fade-up" data-aos-delay="400">


<i class="bi bi-telephone flex-shrink-0"></i>
<div>
<h3>Call Us</h3>
<p>+1 5589 55488 55</p>
</div>
</div><!-- End Info Item -->

<div class="info-item d-flex" data-aos="fade-up" data-aos-delay="500">


<i class="bi bi-envelope flex-shrink-0"></i>
<div>
<h3>Email Us</h3>
<p>[email protected]</p>
</div>
</div><!-- End Info Item -->

</div>

<div class="col-lg-8">
<form action="forms/contact.php" method="post" class="php-email-form"
data-aos="fade-up" data-aos-delay="200">
<div class="row gy-4">

<div class="col-md-6">
<input type="text" name="name" class="form-control"
placeholder="Your Name" required="">
</div>

<div class="col-md-6 ">


<input type="email" class="form-control" name="email"
placeholder="Your Email" required="">
</div>

<div class="col-md-12">
<input type="text" class="form-control" name="subject"
placeholder="Subject" required="">
</div>

<div class="col-md-12">
<textarea class="form-control" name="message" rows="6"
placeholder="Message" required=""></textarea>
</div>

<div class="col-md-12 text-center">


<div class="loading">Loading</div>
<div class="error-message"></div>
<div class="sent-message">Your message has been sent. Thank you!
</div>

<button type="submit">Send Message</button>


</div>

</div>
</form>
</div><!-- End Contact Form -->

</div>

</div>

</section><!-- /Contact Section -->

</main>

<footer id="footer" class="footer">

<div class="container footer-top">


<div class="row gy-4">
<div class="col-lg-4 col-md-6 footer-about">
<a href="index.html" class="logo d-flex align-items-center">
<span class="sitename">Restaurantly</span>
</a>
<div class="footer-contact pt-3">
<p>A108 Adam Street</p>
<p>New York, NY 535022</p>
<p class="mt-3"><strong>Phone:</strong> <span>+1 5589 55488
55</span></p>
<p><strong>Email:</strong> <span>[email protected]</span></p>
</div>
<div class="social-links d-flex mt-4">
<a href=""><i class="bi bi-twitter-x"></i></a>
<a href=""><i class="bi bi-facebook"></i></a>
<a href=""><i class="bi bi-instagram"></i></a>
<a href=""><i class="bi bi-linkedin"></i></a>
</div>
</div>

<div class="col-lg-2 col-md-3 footer-links">


<h4>Useful Links</h4>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About us</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Terms of service</a></li>
<li><a href="#">Privacy policy</a></li>
</ul>
</div>

<div class="col-lg-2 col-md-3 footer-links">


<h4>Our Services</h4>
<ul>
<li><a href="#">Web Design</a></li>
<li><a href="#">Web Development</a></li>
<li><a href="#">Product Management</a></li>
<li><a href="#">Marketing</a></li>
<li><a href="#">Graphic Design</a></li>
</ul>
</div>

<div class="col-lg-4 col-md-12 footer-newsletter">


<h4>Our Newsletter</h4>
<p>Subscribe to our newsletter and receive the latest news about our
products and services!</p>
<form action="forms/newsletter.php" method="post" class="php-email-form">
<div class="newsletter-form"><input type="email" name="email"><input
type="submit" value="Subscribe"></div>
<div class="loading">Loading</div>
<div class="error-message"></div>
<div class="sent-message">Your subscription request has been sent.
Thank you!</div>
</form>
</div>

</div>
</div>

<div class="container copyright text-center mt-4">


<p>© <span>Copyright</span> <strong class="px-1
sitename">Restaurantly</strong> <span>All Rights Reserved</span></p>
<div class="credits">
<!-- All the links in the footer should remain intact. -->
<!-- You can delete the links only if you've purchased the pro version. -->
<!-- Licensing information: https://bootstrapmade.com/license/ -->
<!-- Purchase the pro version with working PHP/AJAX contact form: [buy-url]
-->
Designed by <a href="https://bootstrapmade.com/">BootstrapMade</a>
</div>
</div>

</footer>

<!-- Scroll Top -->


<a href="#" id="scroll-top" class="scroll-top d-flex align-items-center justify-
content-center"><i class="bi bi-arrow-up-short"></i></a>

<!-- Preloader -->


<div id="preloader"></div>

<!-- Vendor JS Files -->


<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/php-email-form/validate.js"></script>
<script src="assets/vendor/aos/aos.js"></script>
<script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
<script src="assets/vendor/imagesloaded/imagesloaded.pkgd.min.js"></script>
<script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
<script src="assets/vendor/swiper/swiper-bundle.min.js"></script>

<!-- Main JS File -->


<script src="assets/js/main.js"></script>

</body>

</html>

You might also like