<!DOCTYPE html>
<html>
<head>
<!-- Basic -->
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!-- Mobile Metas -->
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<!-- Site Metas -->
<link rel="icon" href="images/favicon.png" type="image/gif" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="author" content="" />
<title> Cafeesa </title>
<!-- bootstrap core css -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.css" />
<!-- font awesome style -->
<link href="css/font-awesome.min.css" rel="stylesheet" />
<!-- Custom styles for this template -->
<link href="css/style.css" rel="stylesheet" />
<!-- responsive style -->
<link href="css/responsive.css" rel="stylesheet" />
</head>
<body>
<!-- header section strats -->
<header class="header_section">
<div class="container-fluid">
<nav class="navbar navbar-expand-lg custom_nav-container">
<a class="navbar-brand" href="index.html">
<span>
Cafeesa
</span>
</a>
<div class="" id="">
<div class="custom_menu-btn">
<button onclick="openNav()">
<span class="s-1"> </span>
<span class="s-2"> </span>
<span class="s-3"> </span>
</button>
<div id="myNav" class="overlay">
<div class="overlay-content">
<a href="index.html">Home</a>
<a href="about.html">About</a>
<a href="book.html">Book Table</a>
<a href="testimonial.html">Testimonial</a>
</div>
</div>
</div>
</div>
</nav>
</div>
</header>
<!-- end header section -->
<!-- slider section -->
<section class="slider_section position-relative">
<div class="slider_bg_box">
<img src="images/slider-bg.jpg" alt="">
</div>
<div class="slider_bg"></div>
<div class="container">
<div class="col-md-6 ml-auto">
<div class="detail-box">
<h1>
Welcome To <br>
Our Cafe
</h1>
<p>
It is a long established fact that a reader will be distracted by the readable content of a page when
looking at its layout. The point of using Lorem
</p>
<div>
<a href="" class="slider-link">
Book A Table
</a>
</div>
</div>
</div>
</div>
</section>
<!-- end slider section -->
<!-- special section -->
<section class="spcl_section layout_padding">
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="detail_container">
<div class="detail-box">
<img src="images/s1.png" alt="">
<h5>
Original Coffee
</h5>
<p>
Minima nam cumque officiis placeat perferendis impedit, reprehenderit ratione aut exercitationem a, corrupti nesciunt velit.
</p>
</div>
<div class="detail-box">
<img src="images/s2.png" alt="">
<h5>
Self Roasted
</h5>
<p>
Minima nam cumque officiis placeat perferendis impedit, reprehenderit ratione aut exercitationem a, corrupti nesciunt velit.
</p>
</div>
<div class="detail-box">
<img src="images/s3.png" alt="">
<h5>
15 Coffee Items
</h5>
<p>
Minima nam cumque officiis placeat perferendis impedit, reprehenderit ratione aut exercitationem a, corrupti nesciunt velit.
</p>
</div>
</div>
</div>
<div class="col-md-6 col-lg-5 ml-auto">
<div class="img-box">
<img src="images/spcl-img.jpg" alt="">
</div>
</div>
</div>
</div>
</section>
<!-- end special section -->
<!-- about section -->
<section class="about_section layout_padding-bottom">
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="img-box">
<img src="images/about-img.jpg" alt="">
</div>
</div>
<div class="col-md-6">
<div class="detail-box">
<div class="heading_container">
<h2>
About Us
</h2>
</div>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corrupti dolorem eum consequuntur ipsam repellat dolor soluta aliquid laborum, eius odit consectetur vel quasi in quidem, eveniet ab est corporis tempore.
</p>
<a href="">
Read More
</a>
</div>
</div>
</div>
</div>
</section>
<!-- end about section -->
<!-- contact section -->
<section class="contact_section layout_padding">
<div class="contact_bg_box">
<img src="images/contact-bg.jpg" alt="">
</div>
<div class="container">
<div class="heading_container heading_center">
<h2>
Book A Table
</h2>
</div>
<div class="">
<div class="row">
<div class="col-md-7 mx-auto">
<form action="#">
<div class="contact_form-container">
<div class="row">
<div class="col-sm-6">
<input type="text" placeholder="Full Name" />
</div>
<div class="col-sm-6">
<input type="email" placeholder="Email " />
</div>
</div>
<div class="row">
<div class="col-sm-6">
<input type="text" placeholder="Phone Number" />
</div>
<div class="col-sm-6">
<input type="number" placeholder="Number of People" />
</div>
</div>
<div class="row">
<div class="col-sm-6">
<input type="date" placeholder="Select Date" />
</div>
<div class="col-sm-6">
<input type="time" placeholder="Select Time" />
</div>
</div>
<div class="">
<input type="text" placeholder="Aditional Note" class="message_input" />
</div>
<div class="btn-box ">
<button type="submit">
Send
</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
<!-- end contact section -->
<!-- client section -->
<section class="client_section layout_padding">
<div class="container ">
<div class="heading_container heading_center">
<h2>
What says our clients
</h2>
</div>
<div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<div class="box">
<div class="img-box">
<img src="images/client.jpg" alt="">
</div>
<div class="detail-box">
<h4>
Minim Veniam
</h4>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed
do eiusmod tempor incididunt ut labore et do
HTML绿色实用形式咖啡馆公司企业网站模板代码.zip （31个子文件） 
27042 js 
bootstrap.js 134KB slick.min.js 42KB ekko-lightbox.min.js 14KB custom.js 818B jquery-3.4.1.min.js 86KB
book.html 7KB testimonial.html 8KB _menu.json 282B css style.css 15KB responsive.css 1KB slick.css 2KB bootstrap.css 188KB font-awesome.min.css 30KB slick-theme.css 3KB ekko-lightbox.css 2KB index.html 13KB about.html 6KB images 
about-img.jpg 145KB spcl-img.jpg 262KB
s2.png 38KB s3.png 45KB slider-bg.jpg 313KB client.jpg 24KB contact-bg.jpg 209KB s1.png 67KB favicon.png 15KB _tree.json 100KB fonts fontawesome-webfont.woff 96KB fontawesome-webfont.woff2 75KB octin_sports_rg.ttf 63KB fontawesome-webfont.ttf 162KB资源评论
