You are on page 1of 54

A

MAJOR PROJECT
(BASED ON BCA-606)

ON

HOTEL MANAGEMENT SYSTEM


Submitted
By
RENU YADAV
(BACHELOR OF COMPUTER APPLICATION )
6TH SEM
Under the Guidance of
Mr.Sachine Guar

Department of Computer Science


Faculty of Technology
1.Title of the project:

HOTEL MANAGEMENT SYSTEM

1
2.CERTIFICATE:-

This is to certify that this report represents the original work done by RENU YADAV
during this project submission as a partial fulfilment of the requirement for the System
Design Project of Bechlor Of Computer Application, 6 Semester, of the Disha Institute Of
Science And Technology,Dhampur.

Date:__________ RENU YADAV

BCA 6th SEM

Department Of Computer Science

Disha Institute Of Science And

Technology,Dhampur

2
3.Acknowledgement:-

It gives me immense pleasure in submitting the project report on “HOTEL


MANAGEMENT SYSTEM” for the partial fulfillment of the requirements for the degree
of Bachelors ofComputer Applications (BCA). First of all I am thankful to Disha Institute
Of Science And Technology (D.I.S.T) for giving me the opportunity to work on this
project and for allowing me to work on this project. I am also thankful to Mr.Sachine Guar
Sir, for providing all the privileges. I am highly grateful to my guide in this project
Dr.Sumit Kapoor Sir, for his encouragement, guidance and valuable suggestions, which I
incorporated in my project. And last but not the least I thank my parents and all my friends
who not only encouraged me but also helped me in the process of making of this project.

Date:____________ RENU YADAV

BCA 6th SEM

Department Of Computer Science

Disha Institute Of Science And

Technology,Dhampur

3
4.STATEMENT ABOUT THE PROBLEM:-

Hotel Management System is a hotel reservation site script where site users will be able to search
rooms availability with an online booking reservations system. Site users can also browse hotels,
view room inventory, check availability, and book reservations in real-time. Site users enter
check in date and check out date then search for availability and rates. After choosing the right
room in the wanted hotel – all booking and reservation process is done on the site and an SMS is
sent to confirm the booking.

5. Why is the particular topic chosen ?

Ever since junior school, I had been interested in music. But for years it simply stayed like a
hobby for me until later in my college when after attending a lecture on Psychology, I
realized how music had a huge impact on our moods and emotions. This intrigued me to
further dwell on the topic, gain a thorough understanding of the same and present it here
so that it can reach more people.

I chose the topic because I knew I could elaborate and explain it throughout the activity as I
am familiar with every side of the story, ideas, and information.
6.OBJECTIVE OF THE PROJECT:-

Operational and financial goals may be examined in regards to hotel management. The
operational goal is to have an adequate supply of hotel, so that we can fulfil student
demand and the college objective is to minimise unnecessary hoetel and its associated
expenses.

For these operational tasks, hotel management is done to help streamline operations. Some
of the most important purposes for which it is used are:

7. Requirement Analysis:-

The functional requirement of an online loan management system is that it does what it is

meant for. A functional requirement describes what a software system should do, while

non-functional requirements place constraints on how the system will do so. Functional

4
requirements specify a function that a system or system component must be able to

perform. It can be documented in various ways.

Non-functional necessities measure the other demand than practical necessities. These

square measures the necessities that specify criteria which will be wont to choose the

operation of a system, instead of specific behaviors. Non-functional necessities square

measure within the style of “system shall be “, associate degree overall property of the

system as a full or of a specific facet and not a particular operation..

8. Hardware and Software Requirement Specification:-

I. Hardware Requirements:-

• Processor:-Intel Pentium 3 833 MHz


• RAM:-128 SD-RAM Hard Disk:-20 GB or above.

• Monitor:-14” VGA.

• Mouse

• Printer:-For Print report or Bill

II. Software Requirements:-

a. Php b. Xampp c. Mysql yog d. HTML e. Bootstrap f. Sublime text g. Git hub h. Java Script i. Css

Xampp,apache,visual studio editor

5
9.Data Flow Diagrams:-

I. DFD:-

6
II. Level 1 DFD:-

III. Level 2 DFD:-

7
ER-DIAGRAME:-

8
11.Database Design:-

9
The data base is created in MYSQL. We have applied the constraints at the backend to do
fewer validations in the front end. The structure of the various tables along with their
constraints is as follows:

APPLICATION SCREENSHOT

II. Main Window :-

Project Report Coding

1.index.php :-

10
<?php

include('db.php');

?>

<!DOCTYPE html>

<html lang="en">

<head>

<title>SUNRISE HOTEL</title>

<!-- for-mobile-apps -->

<meta name="viewport" content="width=device-width, initial-scale=1">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<meta name="keywords" content="Resort Inn Responsive , Smartphone


Compatible web template , Samsung, LG, Sony Ericsson, Motorola web
design" />

<script type="application/x-javascript"> addEventListener("load",


function() { setTimeout(hideURLbar, 0); }, false);

function hideURLbar(){ window.scrollTo(0,1); } </script>

<!-- //for-mobile-apps -->

<link href="css/bootstrap.css" rel="stylesheet" type="text/css"


media="all" />

<link href="css/font-awesome.css" rel="stylesheet">

<link rel="stylesheet" href="css/chocolat.css" type="text/css"


media="screen">

<link href="css/easy-responsive-tabs.css" rel='stylesheet'


type='text/css'/>

<link rel="stylesheet" href="css/flexslider.css" type="text/css"


media="screen" property="" />

<link rel="stylesheet" href="css/jquery-ui.css" />

11
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />

<script type="text/javascript" src="js/modernizr-2.6.2.min.js"></script>

<!--fonts-->

<link href="//fonts.googleapis.com/css?family=Oswald:300,400,700"
rel="stylesheet">

<link href="//fonts.googleapis.com/css?family=Federo" rel="stylesheet">

<link href="//fonts.googleapis.com/css?family=Lato:300,400,700,900"
rel="stylesheet">

<!--//fonts-->

</head>

<body>

<!-- header -->

<div class="banner-top">

<div class="social-bnr-agileits">

<ul class="social-icons3">

<li><a
href="https://www.facebook.com/" class="fa fa-facebook icon-border
facebook"> </a></li>

<li><a
href="https://twitter.com/" class="fa fa-twitter icon-border twitter">
</a></li>

<li><a
href="https://plus.google.com/u/0/" class="fa fa-google-plus icon-border
googleplus"> </a></li>

</ul>

</div>

<div class="contact-bnr-w3-agile">

<ul>

12
<li><i class="fa fa-envelope" aria-
hidden="true"></i><a
href="mailto:info@example.com">INFO@SUNRISE.COM</a></li>

<li><i class="fa fa-phone" aria-


hidden="true"></i>+94 (65)222-44-55</li>

<li class="s-bar">

<div class="search">

<input class="search_box"
type="checkbox" id="search_box">

<label class="icon-search"
for="search_box"><span class="glyphicon glyphicon-search" aria-
hidden="true"></span></label>

<div class="search_form">

<form action="#" method="post">

<input type="search"
name="Search" placeholder=" " required=" " />

<input type="submit"
value="Search">

</form>

</div>

</div>

</li>

</ul>

</div>

<div class="clearfix"></div>

</div>

<div class="w3_navigation">

<div class="container">

13
<nav class="navbar navbar-default">

<div class="navbar-header navbar-left">

<button type="button" class="navbar-toggle


collapsed" data-toggle="collapse" data-target="#bs-example-navbar-
collapse-1">

<span class="sr-only">Toggle
navigation</span>

<span class="icon-bar"></span>

<span class="icon-bar"></span>

<span class="icon-bar"></span>

</button>

<h1><a class="navbar-brand" href="index.php">SUN


<span>RISE</span><p class="logo_w3l_agile_caption">Your Dreamy
Resort</p></a></h1>

</div>

<!-- Collect the nav links, forms, and other content for
toggling -->

<div class="collapse navbar-collapse navbar-right"


id="bs-example-navbar-collapse-1">

<nav class="menu menu--iris">

<ul class="nav navbar-nav menu__list">

<li class="menu__item menu__item--


current"><a href="" class="menu__link">Home</a></li>

<li class="menu__item"><a href="#about"


class="menu__link scroll">About</a></li>

<li class="menu__item"><a href="#team"


class="menu__link scroll">Team</a></li>

<li class="menu__item"><a
href="#gallery" class="menu__link scroll">Gallery</a></li>

14
<li class="menu__item"><a href="#rooms"
class="menu__link scroll">Rooms</a></li>

<li class="menu__item"><a
href="#contact" class="menu__link scroll">Contact Us</a></li>

</ul>

</nav>

</div>

</nav>

</div>

</div>

<!-- //header -->

<!-- banner -->

<div id="home" class="w3ls-banner">

<!-- banner-text -->

<div class="slider">

<div class="callbacks_container">

<ul class="rslides callbacks callbacks1" id="slider4">

<li>

<div class="w3layouts-banner-top">

<div class="container">

<div class="agileits-banner-
info">

<h4>SUN RISE</h4>

15
<h3>We know what you
love</h3>

<p>Welcome to our
hotels</p>

<div
class="agileits_w3layouts_more menu__item">

<a href="#" class="menu__link" data-toggle="modal" data-


target="#myModal">Learn More</a>

</div>

</div>

</div>

</div>

</li>

<li>

<div class="w3layouts-banner-top w3layouts-


banner-top1">

<div class="container">

<div class="agileits-banner-
info">

<h4>SUN RISE</h4>

<h3>Stay with friends &


families</h3>

<p>Come & enjoy


precious moment with us</p>

<div
class="agileits_w3layouts_more menu__item">

<a href="#" class="menu__link" data-toggle="modal" data-


target="#myModal">Learn More</a>

</div>

16
</div>

</div>

</div>

</li>

<li>

<div class="w3layouts-banner-top w3layouts-


banner-top2">

<div class="container">

<div class="agileits-banner-
info">

<h4>SUN RISE</h4>

<h3>want luxurious vacation?</h3>

<p>Get accommodation
today</p>

<div
class="agileits_w3layouts_more menu__item">

<a href="#"
class="menu__link" data-toggle="modal" data-target="#myModal">Learn
More</a>

</div>

</div>

</div>

</div>

</li>

</ul>

</div>

17
<div class="clearfix"> </div>

<!--banner Slider starts Here-->

</div>

<div class="thim-click-to-bottom">

<a href="#about" class="scroll">

<i class="fa fa-long-arrow-down" aria-


hidden="true"></i>

</a>

</div>

</div>

<!-- //banner -->

<!--//Header-->

<!-- //Modal1 -->

<div class="modal fade" id="myModal" tabindex="-1" role="dialog">

<!-- Modal1 -->

<div class="modal-dialog">

<!-- Modal content-->

<div class="modal-content">

<div class="modal-header">

<button type="button"
class="close" data-dismiss="modal">&times;</button>

<h4>SUN
<span>RISE</span></h4>

<img
src="images/1.jpg" alt=" " class="img-responsive">

18
<h5>We know what you
love</h5>

<p>Providing guests
unique and enchanting views from their rooms with its exceptional
amenities, makes Star Hotel one of bests in its kind.Try our food menu,
awesome services and friendly staff while you are here.</p>

</div>

</div>

</div>

</div>

<!-- //Modal1 -->

<div id="availability-agileits">

<div class="col-md-12 book-form-left-w3layouts">

<a href="admin/reservation.php"><h2>ROOM RESERVATION</h2></a>

</div>

<div class="clearfix"> </div>

</div>

<!-- banner-bottom -->

<div class="banner-bottom">

<div class="container">

<div class="agileits_banner_bottom">

<h3><span>Experience a good stay, enjoy fantastic


offers</span> Find our friendly welcoming reception</h3>

</div>

<div class="w3ls_banner_bottom_grids">

19
<ul class="cbp-ig-grid">

<li>

<div class="w3_grid_effect">

<span class="cbp-ig-icon
w3_road"></span>

<h4 class="cbp-ig-title">MASTER
BEDROOMS</h4>

<span class="cbp-ig-category">SUN
RISE</span>

</div>

</li>

<li>

<div class="w3_grid_effect">

<span class="cbp-ig-icon
w3_cube"></span>

<h4 class="cbp-ig-title">SEA VIEW


BALCONY</h4>

<span class="cbp-ig-category">SUN
RISE</span>

</div>

</li>

<li>

<div class="w3_grid_effect">

<span class="cbp-ig-icon
w3_users"></span>

<h4 class="cbp-ig-title">LARGE
CAFE</h4>

20
<span class="cbp-ig-category">SUN
RISE</span>

</div>

</li>

<li>

<div class="w3_grid_effect">

<span class="cbp-ig-icon
w3_ticket"></span>

<h4 class="cbp-ig-title">WIFI
COVERAGE</h4>

<span class="cbp-ig-category">SUN
RISE</span>

</div>

</li>

</ul>

</div>

</div>

</div>

<!-- //banner-bottom -->

<!-- /about -->

<div class="about-wthree" id="about">

<div class="container">

<div class="ab-w3l-spa">

<h3 class="title-w3-agileits title-black-


wthree">About Our SUN RISE</h3>

21
<p class="about-para-w3ls">Lorem Ipsum is
simply dummy text of the printing and typesetting industry.Sed tempus
vestibulum lacus blandit faucibus. Nunc imperdiet, diam nec rhoncus
ullamcorper, nisl nulla suscipit ligula, at imperdiet urna</p>

<img src="images/about.jpg" class="img-


responsive" alt="Hair Salon">

<div class="w3l-
slider-img">

<img
src="images/a1.jpg" class="img-responsive" alt="Hair Salon">

</div>

<div class="w3ls-info-about">

<h4>You'll love
all the amenities we offer!</h4>

<p>Lorem ipsum
dolor sit amet, ut magna aliqua. </p>

</div>

</div>

<div class="clearfix"> </div>

</div>

</div>

<!-- //about -->

<!--sevices-->

<div class="advantages">

<div class="container">

<div class="advantages-main">

<h3 class="title-w3-agileits">Our Services</h3>

<div class="advantage-bottom">

22
<div class="col-md-6 advantage-grid left-w3ls wow
bounceInLeft" data-wow-delay="0.3s">

<div class="advantage-block ">

<i class="fa fa-credit-card" aria-


hidden="true"></i>

<h4>Stay First, Pay After! </h4>

<p>Temporibus autem quibusdam et aut officiis


debitis aut rerum necessitatibus saepe eveniet ut et voluptates.</p>

<p><i class="fa fa-check" aria-


hidden="true"></i>Decorated room, proper air conditioned</p>

<p><i class="fa fa-check" aria-


hidden="true"></i>Private balcony</p>

</div>

</div>

<div class="col-md-6 advantage-grid right-w3ls wow zoomIn"


data-wow-delay="0.3s">

<div class="advantage-block">

<i class="fa fa-clock-o" aria-hidden="true"></i>

<h4>24 Hour Restaurant</h4>

<p>Temporibus autem quibusdam et aut officiis


debitis aut rerum necessitatibus saepe eveniet ut et voluptates.</p>

<p><i class="fa fa-check" aria-hidden="true"></i>24


hours room service</p>

<p><i class="fa fa-check" aria-


hidden="true"></i>24-hour Concierge service</p>

</div>

</div>

23
<div class="clearfix"> </div>

</div>

</div>

</div>

</div>

<!--//sevices-->

<!-- team -->

<div class="team" id="team">

<div class="container">

<h3 class="title-w3-agileits title-black-wthree">Meet Our


Team</h3>

<div id="horizontalTab">

<ul class="resp-tabs-list">

<li>

<img src="images/teams1.jpg" alt=" "


class="img-responsive" />

</li>

<li>

<img src="images/teams2.jpg" alt=" "


class="img-responsive" />

</li>

<li>

<img src="images/teams3.jpg" alt=" "


class="img-responsive" />

</li>

24
<li>

<img src="images/teams4.jpg" alt=" "


class="img-responsive" />

</li>

</ul>

<div class="resp-tabs-container">

<div class="tab1">

<div class="col-md-6 team-img-w3-agile">

</div>

<div class="col-md-6 team-Info-agileits">

<h4>Lucas Jimenez</h4>

<span>Manager</span>

<p>Lorem ipsum dolor sit amet,


consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
et dolore magna aliqua. Ut enim ad minim veniam, quis.Lorem ipsum dolor
.</p>

<div class="social-bnr-agileits footer-icons-


agileinfo">

<ul class="social-icons3">

<li><a href="#" class="fa fa-


facebook icon-border facebook"> </a></li>

<li><a href="#" class="fa fa-


twitter icon-border twitter"> </a></li>

<li><a href="#" class="fa fa-


google-plus icon-border googleplus"> </a></li>

<li><a href="#" class="fa fa-rss


icon-border rss"> </a></li>

</ul>

25
</div>

</div>

<div class="clearfix"> </div>

</div>

<div class="tab2">

<div class="col-md-6 team-img-w3-agile">

</div>

<div class="col-md-6 team-Info-agileits">

<h4>Sarah Connor</h4>

<span>Receptionist</span>

<p>Lorem ipsum dolor sit amet,


consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
et dolore magna aliqua. Ut enim ad minim veniam, quis.Lorem ipsum dolor
.</p>

<div class="social-bnr-agileits footer-icons-


agileinfo">

<ul class="social-icons3">

<li><a href="#" class="fa fa-


facebook icon-border facebook"> </a></li>

<li><a href="#" class="fa fa-


twitter icon-border twitter"> </a></li>

<li><a href="#" class="fa fa-


google-plus icon-border googleplus"> </a></li>

<li><a href="#" class="fa fa-rss


icon-border rss"> </a></li>

</ul>

</div>

26
</div>

<div class="clearfix"> </div>

</div>

<div class="tab3">

<div class="col-md-6 team-img-w3-agile">

</div>

<div class="col-md-6 team-Info-agileits">

<h4>Ivan Simpson</h4>

<span>Manager</span>

<p>Lorem ipsum dolor sit amet,


consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
et dolore magna aliqua. Ut enim ad minim veniam, quis.Lorem ipsum dolor
.</p>

<div class="social-bnr-agileits footer-icons-


agileinfo">

<ul class="social-icons3">

<li><a href="#" class="fa fa-


facebook icon-border facebook"> </a></li>

<li><a href="#" class="fa fa-


twitter icon-border twitter"> </a></li>

<li><a href="#" class="fa fa-


google-plus icon-border googleplus"> </a></li>

<li><a href="#" class="fa fa-rss


icon-border rss"> </a></li>

</ul>

</div>

</div>

27
<div class="clearfix"> </div>

</div>

<div class="tab4">

<div class="col-md-6 team-img-w3-agile">

</div>

<div class="col-md-6 team-Info-agileits">

<h4>Marc Gutierrez</h4>

<span>Receptionist</span>

<p>Lorem ipsum dolor sit amet,


consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
et dolore magna aliqua. Ut enim ad minim veniam, quis.Lorem ipsum dolor
.</p>

<div class="social-bnr-agileits footer-icons-


agileinfo">

<ul class="social-icons3">

<li><a href="#" class="fa fa-


facebook icon-border facebook"> </a></li>

<li><a href="#" class="fa fa-


twitter icon-border twitter"> </a></li>

<li><a href="#" class="fa fa-


google-plus icon-border googleplus"> </a></li>

<li><a href="#" class="fa fa-rss


icon-border rss"> </a></li>

</ul>

</div>

</div>

<div class="clearfix"> </div>

28
</div>

</div>

</div>

</div>

</div>

<!-- //team -->

<!-- Gallery -->

<section class="portfolio-w3ls" id="gallery">

<h3 class="title-w3-agileits title-black-wthree">Our Gallery</h3>

<div class="col-md-3 gallery-grid gallery1">

<a href="images/g1.jpg" class="swipebox"><img


src="images/g1.jpg" class="img-responsive" alt="/">

<div class="textbox">

<h4>SUN RISE</h4>

<p><i class="fa fa-picture-o" aria-


hidden="true"></i></p>

</div>

</a>

</div>

<div class="col-md-3 gallery-grid gallery1">

<a href="images/g2.jpg" class="swipebox"><img


src="images/g2.jpg" class="img-responsive" alt="/">

<div class="textbox">

<h4>SUN RISE</h4>

29
<p><i class="fa fa-picture-o" aria-
hidden="true"></i></p>

</div>

</a>

</div>

<div class="col-md-3 gallery-grid gallery1">

<a href="images/g3.jpg" class="swipebox"><img


src="images/g3.jpg" class="img-responsive" alt="/">

<div class="textbox">

<h4>SUN RISE</h4>

<p><i class="fa fa-picture-o" aria-


hidden="true"></i></p>

</div>

</a>

</div>

<div class="col-md-3 gallery-grid gallery1">

<a href="images/g4.jpg" class="swipebox"><img


src="images/g4.jpg" class="img-responsive" alt="/">

<div class="textbox">

<h4>SUN RISE</h4>

<p><i class="fa fa-picture-o" aria-


hidden="true"></i></p>

</div>

</a>

</div>

<div class="col-md-3 gallery-grid gallery1">

30
<a href="images/g5.jpg" class="swipebox"><img
src="images/g5.jpg" class="img-responsive" alt="/">

<div class="textbox">

<h4>SUN RISE</h4>

<p><i class="fa fa-picture-o" aria-


hidden="true"></i></p>

</div>

</a>

</div>

<div class="col-md-3 gallery-grid gallery1">

<a href="images/g6.jpg" class="swipebox"><img


src="images/g6.jpg" class="img-responsive" alt="/">

<div class="textbox">

<h4>SUN RISE</h4>

<p><i class="fa fa-picture-o" aria-


hidden="true"></i></p>

</div>

</a>

</div>

<div class="col-md-3 gallery-grid gallery1">

<a href="images/g6.jpg" class="swipebox"><img


src="images/g7.jpg" class="img-responsive" alt="/">

<div class="textbox">

<h4>SUN RISE</h4>

<p><i class="fa fa-picture-o" aria-


hidden="true"></i></p>

31
</div>

</a>

</div>

<div class="col-md-3 gallery-grid gallery1">

<a href="images/g6.jpg" class="swipebox"><img


src="images/g8.jpg" class="img-responsive" alt="/">

<div class="textbox">

<h4>SUN RISE</h4>

<p><i class="fa fa-picture-o" aria-


hidden="true"></i></p>

</div>

</a>

</div>

<div class="col-md-3 gallery-grid gallery1">

<a href="images/g9.jpg" class="swipebox"><img


src="images/g9.jpg" class="img-responsive" alt="/">

<div class="textbox">

<h4>SUN RISE</h4>

<p><i class="fa fa-picture-o" aria-


hidden="true"></i></p>

</div>

</a>

</div>

<div class="col-md-3 gallery-grid gallery1">

<a href="images/g10.jpg" class="swipebox"><img


src="images/g10.jpg" class="img-responsive" alt="/">

32
<div class="textbox">

<h4>SUN RISE</h4>

<p><i class="fa fa-picture-o" aria-


hidden="true"></i></p>

</div>

</a>

</div>

<div class="col-md-3 gallery-grid gallery1">

<a href="images/g4.jpg" class="swipebox"><img


src="images/g4.jpg" class="img-responsive" alt="/">

<div class="textbox">

<h4>SUN RISE</h4>

<p><i class="fa fa-picture-o" aria-


hidden="true"></i></p>

</div>

</a>

</div>

<div class="col-md-3 gallery-grid gallery1">

<a href="images/g2.jpg" class="swipebox"><img


src="images/g2.jpg" class="img-responsive" alt="/">

<div class="textbox">

<h4>SUN RISE</h4>

<p><i class="fa fa-picture-o" aria-


hidden="true"></i></p>

</div>

</a>

33
</div>

<div class="clearfix"> </div>

</section>

<!-- //gallery -->

<!-- rooms & rates -->

<div class="plans-section" id="rooms">

<div class="container">

<h3 class="title-w3-agileits title-black-wthree">Rooms


And Rates</h3>

<div class="priceing-table-main">

<div class="col-md-3 price-grid">

<div class="price-block agile">

<div class="price-gd-top">

<img src="images/r1.jpg" alt=" " class="img-


responsive" />

<h4>Deluxe Room</h4>

</div>

<div class="price-gd-bottom">

<div class="price-list">

<ul>

<li><i
class="fa fa-star" aria-hidden="true"></i></li>

<li><i
class="fa fa-star" aria-hidden="true"></i></li>

<li><i
class="fa fa-star" aria-hidden="true"></i></li>

34
<li><i
class="fa fa-star" aria-hidden="true"></i></li>

<li><i
class="fa fa-star-o" aria-hidden="true"></i></li>

</ul>

</div>

<div class="price-selet">

<h3><span>$</span>320</h3>

<a href="admin/reservation.php"
>Book Now</a>

</div>

</div>

</div>

</div>

<div class="col-md-3 price-grid ">

<div class="price-block agile">

<div class="price-gd-top">

<img src="images/r2.jpg" alt=" " class="img-


responsive" />

<h4>Luxury Room</h4>

</div>

<div class="price-gd-bottom">

<div class="price-list">

<ul>

35
<li><i class="fa fa-star"
aria-hidden="true"></i></li>

<li><i class="fa fa-star"


aria-hidden="true"></i></li>

<li><i class="fa fa-star"


aria-hidden="true"></i></li>

<li><i class="fa fa-star"


aria-hidden="true"></i></li>

<li><i class="fa fa-star-o"


aria-hidden="true"></i></li>

</ul>

</div>

<div class="price-selet">

<h3><span>$</span>220</h3>

<a href="admin/reservation.php"
>Book Now</a>

</div>

</div>

</div>

</div>

<div class="col-md-3 price-grid lost">

<div class="price-block agile">

<div class="price-gd-top">

<img src="images/r3.jpg" alt=" " class="img-


responsive" />

<h4>Guest House</h4>

</div>

36
<div class="price-gd-bottom">

<div class="price-list">

<ul>

<li><i class="fa fa-star"


aria-hidden="true"></i></li>

<li><i class="fa fa-star"


aria-hidden="true"></i></li>

<li><i class="fa fa-star"


aria-hidden="true"></i></li>

<li><i class="fa fa-star-o"


aria-hidden="true"></i></li>

<li><i class="fa fa-star-o"


aria-hidden="true"></i></li>

</ul>

</div>

<div class="price-selet">

<h3><span>$</span>180</h3>

<a href="admin/reservation.php"
>Book Now</a>

</div>

</div>

</div>

</div>

<div class="col-md-3 price-grid wthree lost">

<div class="price-block agile">

<div class="price-gd-top ">

37
<img src="images/r4.jpg" alt=" "
class="img-responsive" />

<h4>Single Room</h4>

</div>

<div class="price-gd-bottom">

<div class="price-list">

<ul>

<li><i class="fa fa-star"


aria-hidden="true"></i></li>

<li><i class="fa fa-star"


aria-hidden="true"></i></li>

<li><i class="fa fa-star-o"


aria-hidden="true"></i></li>

<li><i class="fa fa-star-o"


aria-hidden="true"></i></li>

<li><i class="fa fa-star-o"


aria-hidden="true"></i></li>

</ul>

</div>

<div class="price-selet">

<h3><span>$</span> 150</h3>

<a href="admin/reservation.php"
>Book Now</a>

</div>

</div>

</div>

</div>

38
<div class="clearfix"> </div>

</div>

</div>

</div>

<!--// rooms & rates -->

<!-- visitors -->

<div class="w3l-visitors-agile" >

<div class="container">

<h3 class="title-w3-agileits title-black-wthree">What


other visitors experienced</h3>

</div>

<div class="w3layouts_work_grids">

<section class="slider">

<div class="flexslider">

<ul class="slides">

<li>

<div class="w3layouts_work_grid_left">

<img src="images/5.jpg" alt=" "


class="img-responsive" />

<div
class="w3layouts_work_grid_left_pos">

<img src="images/c1.jpg"
alt=" " class="img-responsive" />

</div>

</div>

39
<div class="w3layouts_work_grid_right">

<h4>

<i class="fa fa-star" aria-


hidden="true"></i>

<i class="fa fa-star" aria-


hidden="true"></i>

<i class="fa fa-star" aria-


hidden="true"></i>

<i class="fa fa-star" aria-


hidden="true"></i>

<i class="fa fa-star" aria-


hidden="true"></i>

Worth to come again

</h4>

<p>Sed tempus vestibulum lacus


blandit faucibus.

Nunc imperdiet, diam nec


rhoncus ullamcorper, nisl nulla suscipit ligula,

at imperdiet urna. </p>

<h5>Julia Rose</h5>

<p>Germany</p>

</div>

<div class="clearfix"> </div>

</li>

<li>

<div class="w3layouts_work_grid_left">

<img src="images/5.jpg" alt=" "


class="img-responsive" />

40
<div
class="w3layouts_work_grid_left_pos">

<img src="images/c2.jpg"
alt=" " class="img-responsive" />

</div>

</div>

<div class="w3layouts_work_grid_right">

<h4>

<i class="fa fa-star" aria-


hidden="true"></i>

<i class="fa fa-star" aria-


hidden="true"></i>

<i class="fa fa-star" aria-


hidden="true"></i>

<i class="fa fa-star" aria-


hidden="true"></i>

<i class="fa fa-star-o" aria-


hidden="true"></i>

Worth to come again

</h4>

<p>Sed tempus vestibulum lacus


blandit faucibus.

Nunc imperdiet, diam nec


rhoncus ullamcorper, nisl nulla suscipit ligula,

at imperdiet urna. </p>

<h5>Jahnatan Smith</h5>

<p>United States</p>

</div>

41
<div class="clearfix"> </div>

</li>

<li>

<div class="w3layouts_work_grid_left">

<img src="images/5.jpg" alt=" "


class="img-responsive" />

<div
class="w3layouts_work_grid_left_pos">

<img src="images/c3.jpg"
alt=" " class="img-responsive" />

</div>

</div>

<div class="w3layouts_work_grid_right">

<h4>

<i class="fa fa-star" aria-


hidden="true"></i>

<i class="fa fa-star" aria-


hidden="true"></i>

<i class="fa fa-star" aria-


hidden="true"></i>

<i class="fa fa-star" aria-


hidden="true"></i>

<i class="fa fa-star-o" aria-


hidden="true"></i>

Worth to come again

</h4>

<p>Sed tempus vestibulum lacus


blandit faucibus.

42
Nunc imperdiet, diam nec
rhoncus ullamcorper, nisl nulla suscipit ligula,

at imperdiet urna. </p>

<h5>Rosalind Cloer</h5>

<p>Italy</p>

</div>

<div class="clearfix"> </div>

</li>

<li>

<div class="w3layouts_work_grid_left">

<img src="images/5.jpg" alt=" "


class="img-responsive" />

<div
class="w3layouts_work_grid_left_pos">

<img src="images/c4.jpg"
alt=" " class="img-responsive" />

</div>

</div>

<div class="w3layouts_work_grid_right">

<h4>

<i class="fa fa-star" aria-


hidden="true"></i>

<i class="fa fa-star" aria-


hidden="true"></i>

<i class="fa fa-star" aria-


hidden="true"></i>

<i class="fa fa-star-o" aria-


hidden="true"></i>

43
<i class="fa fa-star-o" aria-
hidden="true"></i>

Worth to come again

</h4>

<p>Sed tempus vestibulum lacus


blandit faucibus.

Nunc imperdiet, diam nec


rhoncus ullamcorper, nisl nulla suscipit ligula,

at imperdiet urna. </p>

<h5>Amie Bublitz</h5>

<p>Switzerland</p>

</div>

<div class="clearfix"> </div>

</li>

</ul>

</div>

</section>

</div>

</div>

<!-- visitors -->

<!-- contact -->

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

<div class="container">

<div class="col-lg-6 col-md-6 col-sm-6 contact-w3-agile2" data-


aos="flip-left">

44
<div class="contact-agileits">

<h4>Contact Us</h4>

<p class="contact-agile2">Sign Up For Our News


Letters</p>

<form method="post" name="sentMessage" id="contactForm"


>

<div class="control-group form-group">

<label class="contact-p1">Full Name:</label>

<input type="text" class="form-control"


name="name" id="name" required >

<p class="help-block"></p>

</div>

<div class="control-group form-group">

<label class="contact-p1">Phone
Number:</label>

<input type="tel" class="form-control"


name="phone" id="phone" required >

<p class="help-block"></p>

</div>

<div class="control-group form-group">

45
<label class="contact-p1">Email
Address:</label>

<input type="email" class="form-control"


name="email" id="email" required >

<p class="help-block"></p>

</div>

<input type="submit" name="sub" value="Send Now"


class="btn btn-primary">

</form>

<?php

if(isset($_POST['sub']))

$name =$_POST['name'];

$phone = $_POST['phone'];

$email = $_POST['email'];

$approval = "Not Allowed";

$sql = "INSERT INTO `contact`(`fullname`,


`phoneno`, `email`,`cdate`,`approval`) VALUES
('$name','$phone','$email',now(),'$approval')" ;

if(mysqli_query($con,$sql))

echo"OK";

46
}

?>

</div>

</div>

<div class="col-lg-6 col-md-6 col-sm-6 contact-w3-agile1" data-


aos="flip-right">

<h4>Connect With Us</h4>

<p class="contact-agile1"><strong>Phone :</strong>+94 (65)222-


44-55</p>

<p class="contact-agile1"><strong>Email :</strong> <a


href="mailto:name@example.com">INFO@SUNRISE.COM</a></p>

<p class="contact-agile1"><strong>Address :</strong> New


Kalmunai Road, Batticaloa, Sri Lanka</p>

<div class="social-bnr-agileits footer-icons-agileinfo">

<ul class="social-icons3">

<li><a href="#" class="fa fa-


facebook icon-border facebook"> </a></li>

<li><a href="#" class="fa fa-


twitter icon-border twitter"> </a></li>

<li><a href="#" class="fa fa-


google-plus icon-border googleplus"> </a></li>

</ul>

</div>

47
<iframe
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3074.79050523
20443!2d-
77.84987248482734!3d39.586871613613056!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!
4f13.1!3m3!1m2!1s0x89c9f6a80ccf0661%3A0x7210426c67abc40!2sVirginia+Welco
me+Center%2FSafety+Rest+Area!5e0!3m2!1sen!2sin!4v1485760915662"
></iframe>

</div>

<div class="clearfix"></div>

</div>

</section>

<!-- /contact -->

<div class="copy">

<p>© 2017 SUNRISE . All Rights Reserved | Design by <a


href="index.php">SUNRISE</a> </p>

</div>

<!--/footer -->

<!-- js -->

<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>

<!-- contact form -->

<script src="js/jqBootstrapValidation.js"></script>

<!-- /contact form -->

<!-- Calendar -->

<script src="js/jquery-ui.js"></script>

<script>

$(function() {

48
$( "#datepicker,#datepicker1,#datepicker2,#datepicker3"
).datepicker();

});

</script>

<!-- //Calendar -->

<!-- gallery popup -->

<link rel="stylesheet" href="css/swipebox.css">

<script src="js/jquery.swipebox.min.js"></script>

<script type="text/javascript">

jQuery(function($) {

$(".swipebox").swipebox();

});

</script>

<!-- //gallery popup -->

<!-- start-smoth-scrolling -->

<script type="text/javascript" src="js/move-top.js"></script>

<script type="text/javascript" src="js/easing.js"></script>

<script type="text/javascript">

jQuery(document).ready(function($) {

$(".scroll").click(function(event){

event.preventDefault();

$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);

});

49
});

</script>

<!-- start-smoth-scrolling -->

<!-- flexSlider -->

<script defer src="js/jquery.flexslider.js"></script>

<script type="text/javascript">

$(window).load(function(){

$('.flexslider').flexslider({

animation: "slide",

start: function(slider){

$('body').removeClass('loading');

});

});

</script>

<!-- //flexSlider -->

<script src="js/responsiveslides.min.js"></script>

<script>

// You can also use


"$(window).load(function() {"

$(function () {

// Slideshow 4

$("#slider4").responsiveSlides({

50
auto: true,

pager:true,

nav:false,

speed: 500,

namespace: "callbacks",

before: function () {

$('.events').append("<li>before event
fired.</li>");

},

after: function () {

$('.events').append("<li>after event
fired.</li>");

});

});

</script>

<!--search-bar-->

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

<!--//search-bar-->

<!--tabs-->

<script src="js/easy-responsive-tabs.js"></script>

<script>

$(document).ready(function () {

51
$('#horizontalTab').easyResponsiveTabs({

type: 'default', //Types: default, vertical, accordion

width: 'auto', //auto or any width like 600px

fit: true, // 100% fit in a container

closed: 'accordion', // Start closed if in accordion view

activate: function(event) { // Callback function if tab is switched

var $tab = $(this);

var $info = $('#tabInfo');

var $name = $('span', $info);

$name.text($tab.text());

$info.show();

});

$('#verticalTab').easyResponsiveTabs({

type: 'vertical',

width: 'auto',

fit: true

});

});

</script>

<!--//tabs-->

<!-- smooth scrolling -->

<script type="text/javascript">

52
$(document).ready(function() {

/*

var defaults = {

containerID: 'toTop', // fading element id

containerHoverID: 'toTopHover', // fading element hover id

scrollSpeed: 1200,

easingType: 'linear'

};

*/

$().UItoTop({ easingType: 'easeOutQuart' });

});

</script>

<div class="arr-w3ls">

<a href="#home" id="toTop" style="display: block;"> <span


id="toTopHover" style="opacity: 1;"> </span></a>

</div>

<!-- //smooth scrolling -->

<script type="text/javascript" src="js/bootstrap-3.1.1.min.js"></script>

</body>

</html>

53
54

You might also like