File size: 34.13Kb
<!DOCTYPE html>
<html lang="zxx">
<head>
<!--====== Required meta tags ======-->
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="description" content="Insurance, Health, Agency">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!--====== Title ======-->
<title>Foodix - Fast Foods & Restaurants HTML Template</title>
<!--====== Favicon Icon ======-->
<link rel="shortcut icon" href="../assets/images/favicon.png" type="image/png">
<!--====== Google Fonts ======-->
<link href="https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;500;600;700&family=Hanken+Grotesk:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
<!--====== FontAwesome css ======-->
<link rel="stylesheet" href="../assets/fonts/fontawesome/css/all.min.css">
<!--====== Bootstrap css ======-->
<link rel="stylesheet" href="../assets/vendor/bootstrap/css/bootstrap.min.css">
<!--====== Slick-popup css ======-->
<link rel="stylesheet" href="../assets/vendor/slick/slick.css">
<!--====== Nice Select css ======-->
<link rel="stylesheet" href="../assets/vendor/nice-select/css/nice-select.css">
<!--====== magnific-popup css ======-->
<link rel="stylesheet" href="../assets/vendor/magnific-popup/dist/magnific-popup.css">
<!--====== Jquery UI css ======-->
<link rel="stylesheet" href="../assets/vendor/jquery-ui/jquery-ui.min.css">
<!--====== Animate css ======-->
<link rel="stylesheet" href="../assets/vendor/animate.css">
<!--====== Default css ======-->
<link rel="stylesheet" href="../assets/css/default.css">
<!--====== Style css ======-->
<link rel="stylesheet" href="../assets/css/style.css">
<!--====== RTL Style css ======-->
<link rel="stylesheet" href="../assets/css/rtl-style.css">
</head>
<body>
<!--====== Start Loader Area ======-->
<div class="fd-preloader">
<div class="loader"></div>
</div><!--====== End Loader Area ======-->
<!--====== Start Overlay ======-->
<div class="offcanvas__overlay"></div>
<!--====== End Overlay ======-->
<!--====== Start Sidemenu-wrapper-cart Area ======-->
<div class="sidemenu-wrapper-cart">
<div class="sidemenu-content">
<div class="widget widget-shopping-cart">
<h4>My cart</h4>
<div class="sidemenu-cart-close"><i class="far fa-times"></i></div>
<div class="widget-shopping-cart-content">
<ul class="foodix-mini-cart-list">
<li class="foodix-menu-cart">
<a href="#" class="remove-cart"><i class="far fa-trash-alt"></i></a>
<a href="#">
<img src="../assets/images/product/cart-1.jpg" alt="cart image">
Urban Bourbon Bliss Ribeye
</a>
<span class="quantity">1 × <span><span class="currency">$</span>940.00</span></span>
</li>
<li class="foodix-menu-cart">
<a href="#" class="remove-cart"><i class="far fa-trash-alt"></i></a>
<a href="#">
<img src="../assets/images/product/cart-2.jpg" alt="cart image">
Artisanal Truffle Tango Sirloin
</a>
<span class="quantity">1 × <span><span class="currency">$</span>940.00</span></span>
</li>
<li class="foodix-menu-cart">
<a href="#" class="remove-cart"><i class="far fa-trash-alt"></i></a>
<a href="#">
<img src="../assets/images/product/cart-3.jpg" alt="cart image">
Smoked Paprika Perfection
</a>
<span class="quantity">1 × <span><span class="currency">$</span>940.00</span></span>
</li>
<li class="foodix-menu-cart">
<a href="#" class="remove-cart"><i class="far fa-trash-alt"></i></a>
<a href="#">
<img src="../assets/images/product/cart-4.jpg" alt="cart image">
Tandoori Temptation Tender
</a>
<span class="quantity">1 × <span><span class="currency">$</span>940.00</span></span>
</li>
</ul>
<div class="cart-mini-total">
<div class="cart-total">
<span><strong>Subtotal:</strong></span> <span class="amount">1 × <span><span class="currency">$</span>940.00</span></span>
</div>
</div>
<div class="cart-button">
<a href="checkout.html" class="theme-btn style-one">Proceed to checkout</a>
</div>
</div>
</div>
</div>
</div><!--====== End Sidemenu-wrapper-cart Area ======-->
<!--====== Start Header Area ======-->
<header class="header-area page-header">
<div class="container">
<!--=== Header Navigation ===-->
<div class="header-navigation">
<div class="nav-overlay"></div>
<div class="primary-menu">
<!--=== Site Branding ===-->
<div class="site-branding">
<a href="index.html" class="brand-logo"><img src="../assets/images/logo/logo-main.png" alt="Logo"></a>
</div>
<div class="nav-inner-menu">
<!--=== Foodix Nav Menu ===-->
<div class="foodix-nav-menu">
<!--=== Mobile Logo ===-->
<div class="mobile-logo mb-30 d-block d-xl-none text-center">
<a href="index.html" class="brand-logo"><img src="../assets/images/logo/logo-main.png" alt="Site Logo"></a>
</div>
<!--=== Main Menu ===-->
<nav class="main-menu">
<ul>
<li class="menu-item has-children"><a href="#">Home</a>
<ul class="sub-menu">
<li><a href="index.html">Home Restaurant</a></li>
<li><a href="index-beef.html">Home Beef</a></li>
<li><a href="index-burger.html">Home Burger</a></li>
<li><a href="index-pizza.html">Home Pizza</a></li>
<li><a href="index-sushi.html">Home Sushi</a></li>
</ul>
</li>
<li class="menu-item has-children"><a href="#">Menu</a>
<ul class="sub-menu">
<li><a href="menu-v1.html">Menu List One</a></li>
<li><a href="menu-v2.html">Menu List Two</a></li>
<li><a href="menu-v3.html">Menu Grid</a></li>
<li><a href="menu-details.html">Menu Details</a></li>
</ul>
</li>
<li class="menu-item has-children"><a href="#">Pages</a>
<ul class="sub-menu">
<li><a href="about.html">About Us</a></li>
<li><a href="history.html">Our history</a></li>
<li><a href="chefs.html">Our Chefs</a></li>
<li><a href="gallery.html">Our Gallery</a></li>
<li><a href="faq.html">Faqs</a></li>
<li><a href="404.html">Error 404</a></li>
</ul>
</li>
<li class="menu-item has-children"><a href="#">Shop</a>
<ul class="sub-menu">
<li><a href="products.html">Our Shop</a></li>
<li><a href="menu-details.html">Product Details</a></li>
<li><a href="cart.html">Cart</a></li>
<li><a href="checkout.html">Checkout</a></li>
</ul>
</li>
<li class="menu-item has-children"><a href="#">Blog</a>
<ul class="sub-menu">
<li><a href="blog-grid.html">Blog Grid</a></li>
<li><a href="blog-classic.html">Blog Standard</a></li>
<li><a href="blog-details.html">Blog Details</a></li>
</ul>
</li>
<li class="menu-item"><a href="contact.html">Contact</a></li>
</ul>
</nav>
<!--=== Nav Button ===-->
<div class="nav-button mt-50 d-block d-xl-none text-center">
<a href="contact.html" class="theme-btn style-one">Book A Table</a>
</div>
</div>
<!--=== Nav Right Item ===-->
<div class="nav-right-item">
<div class="nav-button d-none d-xl-block">
<a href="contact.html" class="theme-btn style-one">Book A Table</a>
</div>
<div class="cart-button">
<i class="far fa-shopping-cart"></i>
</div>
<div class="navbar-toggler">
<span></span>
<span></span>
<span></span>
</div>
</div>
</div>
</div>
</div>
</div>
</header><!--====== End Header Area ======-->
<!--====== Start Page Section ======-->
<section class="page-banner">
<div class="page-bg-wrapper p-r z-1 bg_cover pt-100 pb-110" style="background-image: url(../assets/images/bg/page-bg.jpg);">
<div class="container">
<div class="row">
<div class="col-lg-12">
<!--=== Page Banner Content ===-->
<div class="page-banner-content text-center">
<h1 class="page-title">Checkout</h1>
<ul class="breadcrumb-link">
<li><a href="index.html">Home</a></li>
<li class="active">Checkout</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</section><!--====== End Page Section ======-->
<!--====== Start Checkout Section ======-->
<section class="checkout-section pt-130 pb-100">
<div class="container">
<div class="row">
<div class="col-lg-12">
<!--=== Checkout Faqs ===-->
<div class="checkout-faqs wow fadeInUp" id="checkout-faq">
<div class="alert gray-bg">
<h6>Returning customer? <button class="collapsed card-header" data-bs-toggle="collapse" data-bs-target="#collapse3" aria-expanded="false" aria-controls="collapse0">Click here</button></h6>
<div id="collapse3" class="collapse" data-bs-parent="checkout-faq">
<form>
<p>Please login your accont.</p>
<div class="row">
<div class="col-md-6">
<div class="form-group">
<input type="email" id="email-address" name="email-address" class="form_control" value="" placeholder="Your Email Address" required>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<input type="password" id="password" name="password" class="form_control" value="" placeholder="Your Password" required>
</div>
</div>
</div>
<div class="form-footer d-flex align-items-center">
<button type="submit" class="theme-btn style-one">login</button>
<div class="form-check">
<input class="form-check-input" type="checkbox" id="loss-passowrd">
<label class="form-check-label" for="loss-passowrd">
Remember me
</label>
</div>
</div>
<a href="checkout.html" class="cl-pass">Lost your password?</a>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<!--=== Checkout Wrapper ===-->
<div class="checkout-wrapper mt-50 wow fadeInUp">
<!--=== Checkout Form ===-->
<form class="checkout-form">
<div class="row">
<div class="col-xl-8">
<h4 class="title mb-15">Billing Details</h4>
<div class="row">
<div class="col-lg-6">
<div class="form_group">
<label>First Name*</label>
<input type="text" class="form_control" placeholder="First Name" required>
</div>
</div>
<div class="col-lg-6">
<div class="form_group">
<label>Last Name*</label>
<input type="text" class="form_control" placeholder="Last Name" required>
</div>
</div>
<div class="col-lg-12">
<div class="form_group">
<label>Company Name</label>
<input type="text" class="form_control" placeholder="Your Company Name" required>
</div>
</div>
<div class="col-lg-12">
<div class="form_group">
<label>Address*</label>
<input type="text" class="form_control" placeholder="Street Address" required>
<input type="text" class="form_control" placeholder="Apartment, suite, unit etc. (optional)" required>
</div>
</div>
<div class="col-lg-12">
<div class="form_group">
<label>Town / City*</label>
<input type="text" class="form_control" placeholder="Town / City" required>
</div>
</div>
<div class="col-lg-6">
<div class="form_group">
<label>Country*</label>
<input type="text" class="form_control" placeholder="United Kingdom (UK)" required>
</div>
</div>
<div class="col-lg-6">
<div class="form_group">
<label>Postcode / Zip*</label>
<input type="text" class="form_control" placeholder="Postcode / Zip" required>
</div>
</div>
<div class="col-lg-12">
<div class="form_group">
<label>Contact Info*</label>
<input type="email" class="form_control" placeholder="Email Address" name="email" required>
<input type="text" class="form_control" placeholder="Your Phone" name="number" required>
</div>
</div>
<div class="col-lg-12">
<div class="form_group">
<label>Order Notes (optional)</label>
<textarea name="order-note" class="form_control" placeholder="Notes about your order, e.g. special notes for delivery."></textarea>
</div>
</div>
</div>
</div>
<div class="col-xl-4">
<!--=== Shopping Cart Area ===-->
<div class="shopping-cart-area mb-50 wow fadeInDown">
<h4 class="title mb-15">Your order</h4>
<div class="shopping-cart-total">
<table class="table">
<tbody>
<tr>
<td>Cart Subtotal</td>
<td class="price">$270</td>
</tr>
<tr>
<td>Shipping Fee</td>
<td class="price">$50</td>
</tr>
<tr>
<td class="total"><span>Order Total</span></td>
<td class="total price"><span>$320</span></td>
</tr>
<tr>
<td colspan="2" class="accordion-td">
<div class="form_group" id="accordion-coupon">
<label data-bs-toggle="collapse" data-bs-target="#collapse01">Have A Coupon ?</label>
<div id="collapse01" class="collapse" data-bs-parent="#paymentMethod">
<input type="text" class="form_control" placeholder="Coupon Code">
</div>
</div>
</td>
</tr>
</tbody>
</table>
<button class="theme-btn style-one">Proceed to checkout</button>
</div>
</div>
<!--=== Payment Method ===-->
<div class="payment-method mb-30 wow fadeInDown">
<h4 class="title mb-20">Payment Method</h4>
<ul id="paymentMethod" class="mb-20">
<!-- Default unchecked -->
<li class="form-check">
<input class="form-check-input" type="radio" name="flexRadioDefault" id="method1" checked>
<label class="form-check-label" for="method1" data-bs-toggle="collapse" data-bs-target="#collapse0">Cash On Delivery</label>
<div id="collapse0" class="collapse show" data-bs-parent="#paymentMethod">
<p>Pay with cash remains a simple and reliable choice, transcending the complexities of modern finance.</p>
</div>
</li>
<!-- Default unchecked -->
<li class="form-check">
<input class="form-check-input" type="radio" name="flexRadioDefault" id="method2">
<label class="form-check-label" for="method2" data-bs-toggle="collapse" data-bs-target="#collapse1">Direct Bank Transfer</label>
<div id="collapse1" class="collapse" data-bs-parent="#paymentMethod">
<p>Please proceed with your payment directly into our bank account. Kindly use your Order ID as the payment reference. Your order will be processed once the payment reflects in our account.</p>
</div>
</li>
<!-- Default unchecked -->
<li class="form-check">
<input class="form-check-input" type="radio" name="flexRadioDefault" id="method3">
<label class="form-check-label" for="method3" data-bs-toggle="collapse" data-bs-target="#collapse2">Paypal</label>
<div id="collapse2" class="collapse" data-bs-parent="#paymentMethod">
<p>You can make your payment via PayPal. If you don't have a PayPal account, you can use your credit card to complete the transaction.</p>
</div>
</li>
</ul>
<p>We will utilize your personal data to process your order, enhance your experience on our website, and for other purposes outlined in our <a href="#">privacy policy</a>.</p>
<button class="theme-btn style-one">Place Order</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</section><!--====== End Checkout Section ======-->
<!--====== Start Footer ======-->
<footer class="footer-default p-r z-1">
<div class="footer-shape f-shape_one scene"><span data-depth=".3"><img src="../assets/images/shape/shape-2.png" alt="shape"></span></div>
<div class="footer-shape f-shape_two scene"><span data-depth=".4"><img src="../assets/images/shape/shape-3.png" alt="shape"></span></div>
<div class="footer-shape f-shape_three scene"><span data-depth=".5"><img src="../assets/images/shape/shape-4.png" alt="shape"></span></div>
<div class="footer-shape f-shape_four scene"><span data-depth=".6"><img src="../assets/images/shape/shape-5.png" alt="shape"></span></div>
<div class="footer-shape f-shape_five scene"><span data-depth=".7"><img src="../assets/images/shape/shape-6.png" alt="shape"></span></div>
<div class="footer-shape f-shape_six scene"><span data-depth=".8"><img src="../assets/images/shape/shape-7.png" alt="shape"></span></div>
<div class="footer-shape f-shape_seven scene"><span data-depth=".9"><img src="../assets/images/shape/shape-8.png" alt="shape"></span></div>
<div class="container">
<!--=== Footer Widget Area ===-->
<div class="footer-widget-area pt-120 pb-75">
<div class="row">
<div class="col-lg-3 col-md-6 col-sm-6">
<!--=== Footer Widget ===-->
<div class="footer-widget footer-about-widget mb-40 wow fadeInUp">
<div class="widget-content">
<div class="footer-logo mb-25">
<a href="index.html"><img src="../assets/images/logo/logo-white.png" alt="Brand Logo"></a>
</div>
<p>Discover culinary delights recipes
and inspiration in our delightful
food haven..</p>
<ul class="social-link">
<li><a href="#"><i class="fab fa-facebook-f"></i></a></li>
<li><a href="#"><i class="fab fa-twitter"></i></a></li>
<li><a href="#"><i class="fab fa-instagram"></i></a></li>
<li><a href="#"><i class="fab fa-youtube"></i></a></li>
</ul>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6 col-sm-6">
<!--=== Footer Widget ===-->
<div class="footer-widget footer-contact-widget mb-40 wow fadeInUp">
<div class="widget-content">
<h4 class="widget-title">Contact Us</h4>
<ul class="address-list">
<li>1901 Thornridge Cir. Shiloh, Hawaii 81063</li>
<li><a href="tel:+88-344-667-999">+88-344-667-999</a></li>
<li><a href="mailto:order@barger.com">order@foodix.com</a></li>
</ul>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6 col-sm-6">
<!--=== Footer Widget ===-->
<div class="footer-widget footer-nav-widget mb-40 wow fadeInUp">
<div class="widget-content">
<h4 class="widget-title">Quick Link</h4>
<ul class="widget-menu">
<li><a href="#">Home</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Our Menu</a></li>
<li><a href="#">Gallery</a></li>
</ul>
</div>
</div>
</div>
<div class="col-lg-3 col-md-6 col-sm-6">
<!--=== Footer Widget ===-->
<div class="footer-widget footer-opening-widget mb-40 wow fadeInUp">
<div class="widget-content">
<h4 class="widget-title">Opining time</h4>
<ul class="opening-schedule">
<li>Monday<span>: 10.00am - 05.00pm </span></li>
<li>Tuesday<span>: 10.20am - 05.30pm </span></li>
<li>Wednesday<span>: 10.30am - 05.50pm </span></li>
<li>Thursday<span>: 11.00am - 07.10pm </span></li>
<li>Friday : <span class="of-close">Closed</span></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<!--=== Copyright Area ===-->
<div class="copyright-area text-center">
<div class="container">
<div class="copyright-text">
<p>© 2024 All rights reserved design by Pixelfit</p>
</div>
</div>
</div>
</footer><!--====== End Footer ======-->
<!--====== Back To Top ======-->
<a href="#" class="back-to-top" ><i class="far fa-angle-up"></i></a>
<!--====== Jquery js ======-->
<script src="../assets/vendor/jquery-3.6.0.min.js"></script>
<!--====== Popper js ======-->
<script src="../assets/vendor/popper/popper.min.js"></script>
<!--====== Bootstrap js ======-->
<script src="../assets/vendor/bootstrap/js/bootstrap.min.js"></script>
<!--====== Slick js ======-->
<script src="../assets/vendor/slick/slick.min.js"></script>
<!--====== Magnific js ======-->
<script src="../assets/vendor/magnific-popup/dist/jquery.magnific-popup.min.js"></script>
<!--====== Nice-select js ======-->
<script src="../assets/vendor/nice-select/js/jquery.nice-select.min.js"></script>
<!--====== Parallax js ======-->
<script src="../assets/vendor/parallax.min.js"></script>
<!--====== jquery UI js ======-->
<script src="../assets/vendor/jquery-ui/jquery-ui.min.js"></script>
<!--====== WOW js ======-->
<script src="../assets/vendor/wow.min.js"></script>
<!--====== RTl Main js ======-->
<script src="../assets/js/rtl-theme.js"></script>
</body>
</html>