├── .gitattributes
├── README.md
├── about.html
├── contact-form-handler.php
├── contact.html
├── css
    ├── lightbox.css
    ├── responsiveslides.css
    └── style.css
├── database.php
├── gallery.html
├── images
    ├── .DS_Store
    ├── ECOMMERCE_Icons_Service-512.png
    ├── Thumbs.db
    ├── box-bg.png
    ├── box.png
    ├── box1.png
    ├── c1.jpg
    ├── c2.jpg
    ├── contact-us.png
    ├── executiveclubsuite-hero-2x1.jpg
    ├── header-bg.png
    ├── icon1.png
    ├── icon2.png
    ├── imperialclub-hero-2x1.jpg
    ├── iocn3.png
    ├── lightbox-btn-close.gif
    ├── lightbox-btn-next.gif
    ├── lightbox-ico-loading.gif
    ├── list.png
    ├── logo2.png
    ├── map Manila Marriott Hotel.JPG
    ├── mark1.png
    ├── marker.png
    ├── marriott_logo.jpg
    ├── phone.png
    ├── pointer.png
    ├── quote-1.png
    ├── quote-2.png
    ├── regalclubsuite-hero-2x1 - Copy.jpg
    ├── regalclubsuite-hero-2x1.jpg
    ├── slider1.jpg
    ├── slider2.jpg
    ├── slider3.jpg
    ├── special.jpg
    ├── terraceclubsuite-hero-2x1.jpg
    └── top-nav-bg.png
├── index.html
├── index.php
├── js
    ├── jquery.lightbox.js
    └── responsiveslides.min.js
├── process.php
└── services.html


/.gitattributes:
--------------------------------------------------------------------------------
1 | # Auto detect text files and perform LF normalization
2 | * text=auto
3 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # Hotel-website
 2 | Website for hotel built on HTML, CSS and JavaScript <br>
 3 | Checkout Demo [Here](https://hotel-demo-proj.netlify.app/)
 4 | 
 5 | ### ABSTRACT
 6 | 
 7 | This project concentrates on building a website for a hotel. The website is based on html, CSS and JavaScript. It focuses on giving the costumer all the information about the hotel and its services. The website gives details of rooms with pictures and also supports a customer feedback system. Many hotel websites do not have a proper feedback or customer grievances redressal forms. Our project aims at developing the customer support mechanism. This project makes use of basic php and two jQuery plugins to make the webpages more dynamic.
 8 | 
 9 | ### INTRODUCTION
10 | 
11 | During the past several decades Hotel function and information has been transformed from a relatively obscure printed banners and manual customer service to central and top-level management functional web application-based system. There are many factors that have influenced this transformation like technological advances, professionalism, and general recognition of human beings as most important resources.
12 | 
13 | A computer-based management system is designed to handle all the primary information required to display room information etc. A list of all the services and amenities are some of the things that attract the user/customer. This project intends to introduce more user friendliness in the various activities such as searching for hotel, booking a room, customer feedback and getting the location of the hotel. The entire feedback information will be mailed to the hotel admin for further response generation.
14 | 
15 | This project explores various aspects of requirements of a website for hotel and tries to go a step further by giving the visitors a sense of being welcomed. The goal of any project is to establish an interactive user interface that is user(visitor) friendly, and that goal is met here in this project. This project is majorly based on HTML, CSS, JavaScript. It also makes use of basic php and jQuery plugins to make the website effective and efficient.
16 | 
17 | ### OBJECTIVES
18 | 
19 | The main objective of the entire activity is to create a website for hotel information.<br>
20 | 
21 | •	Display different rooms available <br>
22 | •	Book hotel room <br>
23 | •	Show hotel location <br>
24 | •	Provide information on hotel services <br>
25 | •	Finally compute the bill etc <br>
26 | •	Packages available <br>
27 | •	Email facility <br>
28 | •	Feedbacks <br>
29 | 
30 | ### METHODOLOGY
31 | 
32 | #### a.	HTML    :
33 | Hypertext Markup Language (HTML) is the standard markup language for creating web pages and web applications. With Cascading Style Sheets (CSS) and JavaScript, it forms a triad of cornerstone technologies for the World Wide Web. Web browsers receive HTML documents from a web server or from local storage and render the documents into multimedia web pages. HTML describes the structure of a web page semantically and originally included cues for the appearance of the document.
34 | 
35 | #### b.	CSS.  :
36 | Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language like HTML.CSS is a cornerstone technology of the World Wide Web, alongside HTML and JavaScript. CSS is designed to enable the separation of presentation and content, including layout, colors, and fonts. This separation can improve content accessibility, provide more flexibility and control in the specification of presentation characteristics, enable multiple web pages to share formatting by specifying the relevant CSS in a separate .css file, and reduce complexity and repetition in the structural content.
37 | 
38 | #### c.	JavaScript :
39 | As a multi-paradigm language, JavaScript supports event-driven, functional, and imperative (including object-oriented and prototype-based) programming styles. It has an API for working with text, arrays, dates, regular expressions, and basic manipulation of the DOM, but the language itself does not include any I/O, such as networking, storage, or graphics facilities, relying for these upon the host environment in which it is embedded.
40 | 
41 | Initially only implemented client-side in web browsers, JavaScript engines are now embedded in many other types of host software, including server-side in web servers and databases, and in non-web programs such as word processors and PDF software, and in runtime environments that make JavaScript available for writing mobile and desktop applications, including desktop widgets.
42 | 
43 | #### d.	jQuery   :
44 | LightBox Plugin is simple, elegant, unobtrusive, no need extra markup and is used to overlay images on the current page through the power and flexibility of jQuery´s selector. lightBox is a plugin for jQuery and it was inspired in Lightbox JS.
45 | ResponsiveSlides.js is a tiny jQuery plugin that automatically creates responsive slider using images inside a container.
46 | 
47 | ### PROPOSED SYSTEM
48 | 
49 | #### Hardware Requirements
50 | •	Pentium or above Processor<br>
51 | •	2GB+ RAM<br>
52 | #### Software Requirements
53 | •	Windows 32/64 bit operating System<br>
54 | •	Linux or MACOS<br>
55 | •	Web Browser<br>
56 | •	Server(MAMP or any other)<br>
57 | #### Platform
58 | •	Web browser<br>
59 | #### Programming Language/Tools
60 | •	HTML<br>
61 | •	CSS<br>
62 | •	JavaScript<br>
63 | •	Php<br>
64 | •	jQuery<br>
65 | 
66 | #### INNOVATION AND CONTRIBUTION TO THE PROJECT
67 | 
68 | 1. This project proposes customer feedback options in website which most of the average hotel website do not offer.
69 | 2. This project as opposed to real world websites which uses php and angular-js etc., is building entirely on html, CSS and    JavaScript, this has been done bring forth the importance of html.
70 | 3. The outcome of the project helps the costumer to choose the rooms wisely and get varied information on services and location which will eventually be an important factor for the visitor to go ahead with the hotel booking.
71 | 


--------------------------------------------------------------------------------
/about.html:
--------------------------------------------------------------------------------
  1 | <!--
  2 | Author: Syed Ibrahim
  3 | Author URL: http://zeeshanovic.blogspot.com
  4 | -->
  5 | <!DOCTYPE HTML>
  6 | <html>
  7 | 	<head>
  8 | 		<title> Hotel Marriot | About</title>
  9 | 		<link href="css/style.css" rel="stylesheet" type="text/css"  media="all" />
 10 | 		<link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow' rel='stylesheet' type='text/css'>
 11 | 	</head>
 12 | 	<body>
 13 | 		<!---start-Wrap--->
 14 | 			<!---start-header--->
 15 | 			<div class="header">
 16 | 				<div class="wrap">
 17 | 					<div class="header-top">
 18 | 						<div class="logo">
 19 | 							<a href="index.html"><img src="images/logo2.png" title="logo" /></a>
 20 | 						</div>
 21 |                         <img src="images/marriott_logo.jpg" align="center" width=700px height=150 px>
 22 | 						<div class="contact-info">
 23 | 							<a href = "contact.html" target = "_self"> 
 24 | 								<img src = "/images/contact-us.png" alt = "contact-us" width=300px height=50px border = "0"/> 
 25 | 							<p class="phone">Call us : <a href="#">98xxxxxxxx</a></p>
 26 | 							<p class="gps">Gps : <a href="#top123">View map</a></p>
 27 | 							<p class="code">BROUGHT TO YOU BY:<a href="https:zeeshanovic.blogspot.com">Syed Ibrahim</a></p>
 28 | 						</div>
 29 | 						<div class="clear"> </div>
 30 | 					</div>
 31 | 				</div>
 32 | 				<div class="header-top-nav">
 33 | 					<div class="wrap">
 34 | 						<ul>
 35 | 							<li><a href="index.html">Home</a></li>
 36 | 							<li class="active"><a href="about.html">About</a></li>
 37 | 							<li><a href="services.html">Services</a></li>
 38 | 							<li><a href="gallery.html">Gallery</a></li>
 39 | 							<div class="clear"> </div>
 40 | 						</ul>
 41 | 					</div>
 42 | 				</div>
 43 | 			</div>
 44 | 			<!---End-header--->
 45 | 			<div class="clear"> </div>
 46 | 			<!---start-content----->
 47 | 			<div class="content">
 48 | 				<div class="wrap">
 49 | 				<!---start-about---->
 50 | 				<div class="about">
 51 | 				<div class="about-grids">
 52 | 					<div class="about-grid">
 53 | 						<h3>About Our Hotel</h3>
 54 | 						<a href="#"><img src="images/slider1.jpg" title="about"></a>
 55 | 						<span>"With our signature Marriott service and unmatched amenities, our hotel truly embodies a five-star experience. Relax in our spacious guest rooms and suites, which feature thoughtful details like private balconies and marble bathrooms."</span>
 56 | 						<p> Feel like home.</p>
 57 | 						<a class="button1" href="index.html">Visit Home Page</a>
 58 | 					</div>
 59 | 					<div class="about-grid center-grid1">
 60 | 						<h3>WHY CHOOSE US?</h3>
 61 | 						<p>Our hotel's central location in Bengaluru, India puts guests in the heart of the business district and close to the retail hub of UB City.</p>
 62 | 						<label>EVENTS AND FUNCTION </label>
 63 | 						<p>Host a wedding or business conference in one of our hotel's sophisticated and versatile event spaces, the largest of which can accommodate 500 guests.</p>
 64 | 						<label>LOCATION</label>
 65 | 						<p>Located adjacent to Cubbon Park, our hotel features scenic views of one Bengaluru's most beloved public spaces.</p>
 66 | 					</div>
 67 | 					<div class="about-grid last-grid">
 68 | 						<h3>Our Hotel's Staff Info.</h3>
 69 | 						<div class="about-team">
 70 | 							<div class="client">
 71 | 								<div class="about-team-left">
 72 | 									<a href="#"><img src="images/c1.jpg" title="Syed Ibrahim"></a>
 73 | 								</div>
 74 | 								<div class="about-team-right">
 75 | 									<p> Syed Ibrahim <br> Manager</p>
 76 | 								</div>
 77 | 								<div class="clear"> </div>
 78 | 							</div>
 79 | 							<div class="client">
 80 | 								<div class="about-team-left">
 81 | 									<a href="#"><img src="images/c2.jpg" title="Surya sharma "></a>
 82 | 								</div>
 83 | 								<div class="about-team-right">
 84 | 									<p>Surya sharma <br> Asst.Manager</p>
 85 | 								</div>
 86 | 								<div class="clear"> </div>
 87 | 							</div>
 88 | 							<div class="client">
 89 | 								<div class="about-team-left">
 90 | 									<a href="#"><img src="images/c1.jpg" title="Suleman Khan"></a>
 91 | 								</div>
 92 | 								<div class="about-team-right">
 93 | 									<p>Suleman Khan <br> Staff Head</p>
 94 | 								</div>
 95 | 								<div class="clear"> </div>
 96 | 							</div>
 97 | 							<div class="client">
 98 | 								<div class="about-team-left">
 99 | 									<a href="#"><img src="images/c2.jpg" title="Allu Shekar"></a>
100 | 								</div>
101 | 								<div class="about-team-right">
102 | 									<p>Allu Shekar <br>Representative</p>
103 | 								</div>
104 | 								<div class="clear"> </div>
105 | 							</div>
106 | 						</div>
107 | 					</div>
108 | 					<div class="clear"> </div>
109 | 				</div>
110 | 			</div>
111 | 			</div>
112 | 				<!---End-about---->
113 | 				<div class="clear"> </div>
114 | 				<div class="boxs">
115 | 				<div class="wrap">
116 | 				<div class="box">
117 | 			
118 | 				</div>
119 | 				<div class="box center-box">
120 | 					<ul>
121 | 						<li><a href="#" onclick="myFunction()">Leave a Feedback</a></li>
122 | 						<li><a href="#" onclick="myFunction1()">Reviews and Ratings</a></li>
123 | 						<li><a href="gallery.html">gallery</a></li>
124 | 						<li><a href="services.html">Services</a></li>
125 | 						<li><a href="https:www.quora.com/What-is-trekking">Know about Moutaineering and trekking here</a></li>
126 | 						<li><a href="https:zeeshanovic.blogspot.com">zeeshanovic.blogspot.com</a></li>
127 | 					</ul>
128 | 				</div>
129 |                      <div id="top123"> 
130 |                           <img src="images/map Manila Marriott Hotel.JPG" height=200px width=450px height=125px width=450px align= rights>
131 |                     </div>
132 | 				<div class="box">
133 | 					
134 | 				</div>
135 | 				<div class="clear"> </div>
136 | 			</div>
137 | 			<!---start-box---->
138 | 		</div>
139 | 		<!---start-copy-Right----->
140 | 		<div class="copy-tight">
141 | 			<p>&copy HOTEL Awesome,Demo Land 2018</p>
142 | 		</div>
143 | 		<!---End-copy-Right----->
144 | 			</div>
145 | 			<!---End-content----->
146 | 		</div>
147 | 		<!---End-Wrap--->
148 | 	</body>
149 | </html>
150 | 
151 | 


--------------------------------------------------------------------------------
/contact-form-handler.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | $name=$_Post['userName'];
 3 | $email_from = 'electroniumweb@gmail.com';
 4 | $email_subject = " Hotel booking successful";
 5 | $email_body= "User email: $userName \n".
 6 |              "Message: Thank you for booking";
 7 | $to = "ibrahimsyed026@gmail.com";
 8 | $headers = "From: $email_from \r\n";
 9 | $headers .= "Reply-To: $name \r\n";
10 | 
11 | $retval = mail($to,$email_subject,$email_body,$headers);
12 | /* if( $retval == true ) {
13 |             echo "Message sent successfully...";
14 |          }else {
15 |             echo "Message could not be sent...";
16 |          }*/
17 | 
18 | $name1= $_POST["userName"]; 
19 |  echo "Dear Customer,"."<br><br>". "Our customer care executive will reach you shortly"."<br>"." <em><u>User Email</u>: </em><b>$name1</b>"."<br><br><br>";
20 | echo "<u><b>Recieved Feedback:</b></u>"."<br><br><br>";
21 | $name2= $_POST["message"]; 
22 |  echo $name2."<br><br><br><hr>";
23 | echo "Today is " . date("Y/m/d") . "<br>";
24 | echo "Today is " . date("l");
25 | 
26 | //header("Location: contact.html");
27 | ?>


--------------------------------------------------------------------------------
/contact.html:
--------------------------------------------------------------------------------
  1 | <!--
  2 | Author: Syed Ibrahim
  3 | Author URL: http://zeeshanovic.blogspot.com
  4 | -->
  5 | <!DOCTYPE HTML>
  6 | <html>
  7 | 	<head>
  8 | 		<title>Hotel Website | Gallery </title>
  9 | 		<link href="css/style.css" rel="stylesheet" type="text/css"  media="all" />
 10 | 		<link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow' rel='stylesheet' type='text/css'>
 11 | 	</head>
 12 | 	<body>
 13 | 		<!---start-Wrap--->
 14 | 			<!---start-header--->
 15 | 			<div class="header">
 16 | 				<div class="wrap">
 17 | 					<div class="header-top">
 18 | 						<div class="logo">
 19 | 							<a href="index.html"><img src="images/logo2.png" title="logo" /></a>
 20 |                            
 21 | 						</div>
 22 |                          <img src="images/marriott_logo.jpg" align="center" width=700px height=150 px>
 23 | 						<div class="contact-info">
 24 | 							<p class="phone">Call us : <a href="#">98xxxxxxxx</a></p>
 25 | 							<p class="gps">Gpa : <a href="#top123">View map</a></p>
 26 | 							<p class="code">BROUGHT TO YOU BY:<a href="https:zeeshanovic.blogspot.com">Syed Ibrahim</a></p>
 27 | 						</div>
 28 | 						<div class="clear"> </div>
 29 | 					</div>
 30 | 				</div>
 31 | 				<div class="header-top-nav">
 32 | 					<div class="wrap">
 33 | 						<ul>
 34 | 							<li><a href="index.html">Home</a></li>
 35 | 							<li><a href="about.html">About</a></li>
 36 | 							<li><a href="services.html">Services</a></li>
 37 | 							<li><a href="gallery.html">Gallery</a></li>
 38 | 							<li class="active"><a href="contact.html">Contact</a></li>
 39 | 							<div class="clear"> </div>
 40 | 						</ul>
 41 | 					</div>
 42 | 				</div>
 43 | 			</div>
 44 | 			<!---End-header--->
 45 | 			<div class="clear"> </div>
 46 | 			<!---start-content----->
 47 | 			<div class="content">
 48 | 				<div class="wrap">
 49 | 					<!-------start-contatct------>
 50 | 					<div class="contact">
 51 | 				<div class="section group">				
 52 | 				<div class="col span_1_of_3">
 53 | 					<div class="contact_info">
 54 | 			    	 	
 55 |       				</div>
 56 |                     <img src="images/ECOMMERCE_Icons_Service-512.png" align="left" width=180px height=200px>
 57 |       		
 58 | 				</div>				
 59 | 				<div class="col span_2_of_3">
 60 | 				  <div class="contact-form">
 61 | 				  	<h3>Contact Us</h3>
 62 | 					    <form method="post"  action="contact-form-handler.php"  netlify >
 63 |                      
 64 |                            
 65 | 					    	<div>
 66 | 						    	<span><label>Enter Email Id</label></span>
 67 | 						    	<span><input name="userName" type="text" class="textbox"></span>
 68 |                                 <span><label>Enter Feedback</label></span>
 69 |                                 <textarea name="message" rows="10" cols="30">Please enter your valuable feeback.</textarea>
 70 |                                 
 71 | 						    </div>
 72 | 						   
 73 | 						   <div>
 74 | 						   		<span><input type="submit" value="Submit" onclick="myFunction()"></span>
 75 | 						  </div>
 76 |                                 </fieldset>
 77 | 					    </form>
 78 | 
 79 | 				    </div>
 80 |   				</div>				
 81 | 			  </div>
 82 | 			</div>
 83 | 					<!-------start-contatct------>
 84 | 				</div>
 85 | 				<div class="clear"> </div>
 86 | 				<div class="boxs">
 87 | 				<div class="wrap">
 88 | 				<div class="box">
 89 | 				
 90 | 				</div>
 91 | 				<div class="box center-box">
 92 | 					<ul>
 93 | 						<li><a href="https:zeeshanovic.blogspot.com">Leave a Feedback</a></li>
 94 | 						<li><a href="https:zeeshanovic.blogspot.com">Reviews and Ratings</a></li>
 95 | 						<li><a href="https:zeeshanovic.blogspot.com">FAQs</a></li>
 96 | 						<li><a href="https:zeeshanovic.blogspot.com">Packages</a></li>
 97 | 						<li><a href="https:zeeshanovic.blogspot.com">Know about Moutaineering and trekking here</a></li>
 98 | 						<li><a href="https:zeeshanovic.blogspot.com">zeeshanovic.blogspot.com</a></li>
 99 | 					</ul>
100 | 				</div>
101 |                      <div id="top123"> 
102 |                           <img src="images/map Manila Marriott Hotel.JPG" height=200px width=450px height=125px width=450px align= rights>
103 |                     </div>
104 | 				<div class="box">
105 | 					 
106 | 				</div>
107 | 				<div class="clear"> </div>
108 | 			</div>
109 | 			<!---start-box---->
110 | 		</div>
111 |         <!---start-copy-Right----->
112 | 		<div class="copy-tight">
113 | 			<p>&copy HOTEL Awesome,Demo Land 2018</p>
114 | 		</div>
115 | 		<!---End-copy-Right----->
116 | 		
117 | 			</div>
118 | 			<!---End-content----->
119 | 		</div>
120 | 		<!---End-Wrap--->
121 | <script>
122 | function myFunction() {
123 |     var person = prompt("Please enter your name", "Harry Potter");
124 |     if (person != null) {
125 |         alert("Thank you for your response  " + person + "! Have a nice day");
126 | 
127 |     }
128 | }
129 | </script>
130 | 
131 | 	</body>
132 | </html>
133 | 
134 | 


--------------------------------------------------------------------------------
/css/lightbox.css:
--------------------------------------------------------------------------------
  1 | /**
  2 |  * jQuery lightBox plugin
  3 |  * This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
  4 |  * and adapted to me for use like a plugin from jQuery.
  5 |  * @name jquery-lightbox-0.5.css
  6 |  * @author Leandro Vieira Pinho - http://leandrovieira.com
  7 |  * @version 0.5
  8 |  * @date April 11, 2008
  9 |  * @category jQuery plugin
 10 |  * @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
 11 |  * @license CCAttribution-ShareAlike 2.5 Brazil - http://creativecommons.org/licenses/by-sa/2.5/br/deed.en_US
 12 |  * @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
 13 |  */
 14 | #jquery-overlay {
 15 | 	position: absolute;
 16 | 	top: 0;
 17 | 	left: 0;
 18 | 	z-index: 90;
 19 | 	width: 100%;
 20 | 	height: 500px;
 21 | }
 22 | #jquery-lightbox {
 23 | 	position: absolute;
 24 | 	top: 0;
 25 | 	left: 0;
 26 | 	width: 100%;
 27 | 	z-index: 100;
 28 | 	text-align: center;
 29 | 	line-height: 0;
 30 | }
 31 | #lightbox-image img{
 32 | 	width:100%;
 33 | }
 34 | #jquery-lightbox a img { border: none; }
 35 | #lightbox-container-image-box {
 36 | 	position: relative;
 37 | 	background-color: #fff;
 38 | 	width: 250px;
 39 | 	height: 250px;
 40 | 	margin: 0 auto;
 41 | }
 42 | #lightbox-container-image { padding: 10px; }
 43 | #lightbox-loading {
 44 | 	position: absolute;
 45 | 	top: 40%;
 46 | 	left: 0%;
 47 | 	height: 25%;
 48 | 	width: 100%;
 49 | 	text-align: center;
 50 | 	line-height: 0;
 51 | }
 52 | #lightbox-nav {
 53 | 	position: absolute;
 54 | 	top: 0;
 55 | 	left: 0;
 56 | 	height: 100%;
 57 | 	width: 100%;
 58 | 	z-index: 10;
 59 | }
 60 | #lightbox-container-image-box > #lightbox-nav { left: 0; }
 61 | #lightbox-nav a { outline: none;}
 62 | #lightbox-nav-btnPrev, #lightbox-nav-btnNext {
 63 | 	width: 49%;
 64 | 	height: 100%;
 65 | 	zoom: 1;
 66 | 	display: block;
 67 | }
 68 | #lightbox-nav-btnPrev { 
 69 | 	left: 0; 
 70 | 	float: left;
 71 | }
 72 | #lightbox-nav-btnNext { 
 73 | 	right: 0; 
 74 | 	float: right;
 75 | }
 76 | #lightbox-container-image-data-box {
 77 | 	font: 10px Verdana, Helvetica, sans-serif;
 78 | 	background-color: #fff;
 79 | 	margin: 0 auto;
 80 | 	line-height: 1.4em;
 81 | 	overflow: auto;
 82 | 	width: 100%;
 83 | 	padding: 0 10px 0;
 84 | }
 85 | #lightbox-container-image-data {
 86 | 	padding: 0 10px; 
 87 | 	color: #666; 
 88 | }
 89 | #lightbox-container-image-data #lightbox-image-details { 
 90 | 	width: 70%; 
 91 | 	float: left; 
 92 | 	text-align: left; 
 93 | }	
 94 | #lightbox-image-details-caption { font-weight: bold; }
 95 | #lightbox-image-details-currentNumber {
 96 | 	display: block; 
 97 | 	clear: left; 
 98 | 	padding-bottom: 1.0em;	
 99 | }			
100 | #lightbox-secNav-btnClose {
101 | 	width: 66px; 
102 | 	float: right;
103 | 	padding-bottom: 0.7em;	
104 | }


--------------------------------------------------------------------------------
/css/responsiveslides.css:
--------------------------------------------------------------------------------
 1 | /*! http://responsiveslides.com v1.53 by @viljamis */
 2 | 
 3 | .rslides {
 4 |   position: relative;
 5 |   list-style: none;
 6 |   overflow: hidden;
 7 |   padding: 0;
 8 |   margin: 0;
 9 |   }
10 | 
11 | .rslides li {
12 |   -webkit-backface-visibility: hidden;
13 |   position: absolute;
14 |   display: none;
15 |   width: 100%;
16 |   left: 0;
17 |   top: 0;
18 |   }
19 | 
20 | .rslides li:first-child {
21 |   position: relative;
22 |   display: block;
23 |   float: left;
24 |   }
25 | 
26 | .rslides img {
27 |  	display: block;
28 | 	height: auto;
29 | 	float: left;
30 | 	border: 0;
31 | 	width: 100%;
32 | 	border-top: 10px solid #454545;
33 |   }
34 | 


--------------------------------------------------------------------------------
/css/style.css:
--------------------------------------------------------------------------------
   1 | /* reset */
   2 | html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,dl,dt,dd,ol,nav ul,nav li,fieldset,form,label,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
   3 | article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
   4 | ol,ul{list-style:none;margin:0px;padding:0px;}
   5 | blockquote,q{quotes:none;}
   6 | blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
   7 | table{border-collapse:collapse;border-spacing:0;}
   8 | /* start editing from here */
   9 | a{text-decoration:none;}
  10 | .txt-rt{text-align:right;}/* text align right */
  11 | .txt-lt{text-align:left;}/* text align left */
  12 | .txt-center{text-align:center;}/* text align center */
  13 | .float-rt{float:right;}/* float right */
  14 | .float-lt{float:left;}/* float left */
  15 | .clear{clear:both;}/* clear float */
  16 | .pos-relative{position:relative;}/* Position Relative */
  17 | .pos-absolute{position:absolute;}/* Position Absolute */
  18 | .vertical-base{	vertical-align:baseline;}/* vertical align baseline */
  19 | .vertical-top{	vertical-align:top;}/* vertical align top */
  20 | nav.vertical ul li{	display:block;}/* vertical menu */
  21 | nav.horizontal ul li{	display: inline-block;}/* horizontal menu */
  22 | img{max-width:100%;}
  23 | body{
  24 | 	background: url(../images/box-bg.png);
  25 | }
  26 | /*end reset*/
  27 | /*=============================
  28 |  * start-wrap
  29 |  ============================*/
  30 | .wrap{
  31 | 	width:80%;
  32 | 	margin:0 auto;
  33 | }
  34 | /*=============================
  35 |  * start-header
  36 |  ============================*/
  37 | .header{
  38 | 	background: url(../images/box1.png) repeat-x;
  39 | }
  40 | .header-top{
  41 | 	padding: 41px 0 30px 0;
  42 | }
  43 | s
  44 | .logo{
  45 | 	float:left;
  46 | 	margin-top: 0.8em;
  47 | }
  48 | .contact-info{
  49 | 	float:right;
  50 | }
  51 | .contact-info p{
  52 | 	font-family: 'PT Sans Narrow', sans-serif;
  53 | 	font-size: 1.3em;
  54 | 	font-weight: 400;
  55 | 	color: #3B3B3B;
  56 | 	text-transform: uppercase;
  57 | }
  58 | .contact-info p a{
  59 | 	color:#1b98b1;
  60 | 	transition: 0.5s ease;
  61 | 	-o-transition: 0.5s ease;
  62 | 	-webkit-transition: 0.5s ease;
  63 | }
  64 | .contact-info p a:hover{
  65 | 	color:#3B3B3B;
  66 | }
  67 | .header-top-nav ul li{
  68 | 	display: inline-block;
  69 | 	border-left: 1px solid rgba(85, 85, 85, 0.41);
  70 | 	float: left;
  71 | }
  72 | .header-top-nav ul li a{
  73 | 	color: #FFF;
  74 | 	font-family: 'PT Sans Narrow', sans-serif;
  75 | 	font-size: 1.3em;
  76 | 	font-weight: 400;
  77 | 	text-transform: uppercase;
  78 | 	display: block;
  79 | 	padding: 11px 95.5px;
  80 | 	transition: 0.5s ease;
  81 | 	-o-transition: 0.5s ease;
  82 | 	-webkit-transition: 0.5s ease;
  83 | }
  84 | .header-top-nav li.active> a, .header-top-nav li> a:hover {
  85 | 	color: #ff9900;
  86 | 	background: #454545;
  87 | }
  88 | .header-top-nav{
  89 | 	background: url(../images/top-nav-bg.png) repeat-x;
  90 | }
  91 | .phone:before{
  92 | 	content: url(../images/phone.png);
  93 | 	vertical-align: middle;
  94 | 	padding: 0px 5px 0px 0px;
  95 | }
  96 | .gpa:before{
  97 | 	content:url(../images/pointer.png);
  98 | 	vertical-align: middle;
  99 | 	padding: 0px 5px 0px 0px;
 100 | }
 101 | /*=============================
 102 |  * start-content
 103 |  ============================*/
 104 | .content-grid-pic{
 105 | 	float:left;
 106 | 	width:25%;
 107 | 	margin-top: 27px;
 108 | }
 109 | .content-grid-pic img{
 110 | 	display: block;
 111 | 	border-radius: 50%;
 112 | 	border: 5px solid #fff;
 113 | 	box-shadow: 0px 0px 10px rgba(119, 119, 119, 0.25)
 114 | }
 115 | .content-grid-info{
 116 | 	float:right;
 117 | 	width: 69.5%;
 118 | }
 119 | .content-grid-info h3{
 120 | 	font-family: 'PT Sans Narrow', sans-serif;
 121 | 	font-size: 1.8em;
 122 | 	font-weight: 400;
 123 | 	color: #995c00;
 124 | 	text-transform: uppercase;
 125 | }
 126 | .content-grid-info p{
 127 | 	font-family: Arial, Helvetica, sans-serif;
 128 | 	color: #6a6a6a;
 129 | 	font-size: 0.875em;
 130 | 	padding: 5px 0 5px 0;
 131 | 	line-height: 1.5em;
 132 | }
 133 | .content-grid-info a{
 134 | 	font-family: 'PT Sans Narrow', sans-serif;
 135 | 	font-size:1em;
 136 | 	font-weight: 400;
 137 | 	color: #3B3B3B;
 138 | 	text-transform: uppercase;
 139 | 	transition: 0.5s ease;
 140 | 	-o-transition: 0.5s ease;
 141 | 	-webkit-transition: 0.5s ease;
 142 | }
 143 | .content-grid-info a:hover{
 144 | 	color:#71D6EA;
 145 | }
 146 | .content-grid{
 147 | 	float:left;
 148 | 	width:33.333%;
 149 | }
 150 | .content-grids{
 151 | 	padding: 3.5em 0 3.7em 0;
 152 | 	background: url(../images/box.png);
 153 | 	margin:0 0 40px 0px;
 154 | }
 155 | .start:before{
 156 | 	content: url(../images/quote-1.png);
 157 | 	vertical-align: super;
 158 | 	padding-right:5px;
 159 | }
 160 | .end:after{
 161 | 	content: url(../images/quote-2.png);
 162 | 	vertical-align: super;
 163 | 	padding-right:5px;
 164 | }
 165 | .quit p{
 166 | 	font-family: 'PT Sans Narrow', sans-serif;
 167 | 	font-size: 2em;
 168 | 	font-weight: 400;
 169 | 	color: #3B3B3B;
 170 | 	text-transform: uppercase;
 171 | 	display: block;
 172 | 	width: 60%;
 173 | 	text-align: center;
 174 | 	margin: 0.5em auto;
 175 | }
 176 | /*=============================
 177 |  * start-content-box
 178 |  ============================*/
 179 | .content-box-left{
 180 | 	float:left;
 181 | 	width:70%;
 182 | }
 183 | .content-box-left-topgrid h3{
 184 | 	font-family: 'PT Sans Narrow', sans-serif;
 185 | 	font-size: 1.8em;
 186 | 	font-weight: 400;
 187 | 	color: #995c00;
 188 | 	text-transform: uppercase;
 189 | 	border-bottom: 1px solid rgba(85, 85, 85, 0.1);
 190 | 	padding: 0em 0 0.2em 0;
 191 | 	margin: 0px 0px 0.5em 0;
 192 | }
 193 | .content-box-left-topgrid p{
 194 | 	font-family: Arial, Helvetica, sans-serif;
 195 | 	color: #6a6a6a;
 196 | 	font-size: 0.875em;
 197 | 	padding: 5px 0 5px 0;
 198 | 	line-height: 1.5em;
 199 | }
 200 | .content-box-left-topgrid span{
 201 | 	font-family: 'PT Sans Narrow', sans-serif;
 202 | 	font-size: 1.8em;
 203 | 	font-weight: 400;
 204 | 	color: #3B3B3B;
 205 | 	text-transform: uppercase;
 206 | 	border-top: 1px solid rgba(85, 85, 85, 0.1);
 207 | 	border-bottom: 1px solid rgba(85, 85, 85, 0.1);
 208 | 	padding: 1em 0;
 209 | 	display: block;
 210 | 	width: 80%;
 211 | 	text-align: center;
 212 | 	margin: 0.5em 0;
 213 | }
 214 | .content-box-right{
 215 | 	float:right;
 216 | 	width:27%;
 217 | }
 218 | .content-box-left-bootomgrid{
 219 | 	width:31.33%;
 220 | 	float:left;
 221 | 	margin-right:3%;
 222 | }
 223 | .content-box-left-bootomgrid h3{
 224 | 	font-family: 'PT Sans Narrow', sans-serif;
 225 | 	font-size: 1.3em;
 226 | 	font-weight: 400;
 227 | 	color: #3B3B3B;
 228 | 	text-transform: uppercase;
 229 | }
 230 | .content-box-left-bootomgrid p{
 231 | 	font-family: Arial, Helvetica, sans-serif;
 232 | 	color: #6a6a6a;
 233 | 	font-size: 0.875em;
 234 | 	padding: 0.5em 0;
 235 | 	line-height: 1.8em;
 236 | }
 237 | .content-box-left-bootomgrid img{
 238 | 	background:#FFF;
 239 | 	padding:5px;
 240 | 	display:block;
 241 | 	width: 93%;
 242 | 	transition: 0.5s ease;
 243 | 	-o-transition: 0.5s ease;
 244 | 	-webkit-transition: 0.5s ease;
 245 | }
 246 | .content-box-left-bootomgrid:hover img{
 247 | 	background:#71D6EA;
 248 | }
 249 | .content-box-left-bootomgrids {
 250 | 	padding: 0.5em 0 2em 0;
 251 | }
 252 | .lastgrid{
 253 | 	margin:0;
 254 | }
 255 | .content-box-right-topgrid h3{
 256 | 	font-family: 'PT Sans Narrow', sans-serif;
 257 | 	font-size: 1.8em;
 258 | 	font-weight: 400;
 259 | 	color: #cc0000;
 260 | 	text-transform: uppercase;
 261 | 	border-bottom: 1px solid rgba(85, 85, 85, 0.1);
 262 | 	padding: 0em 0 5px 0;
 263 | 	display: block;
 264 | 	margin: 0 0 0.6em 0;
 265 | }
 266 | .content-box-right-topgrid h4{
 267 | 	font-family: 'PT Sans Narrow', sans-serif;
 268 | 	font-size: 1.3em;
 269 | 	font-weight: 400;
 270 | 	color: #3B3B3B;
 271 | 	text-transform: uppercase;
 272 | 	padding: 0.5em 0 0.0em 0;
 273 | }
 274 | .content-box-right-topgrid p{
 275 | 	font-family: Arial, Helvetica, sans-serif;
 276 | 	color: #6a6a6a;
 277 | 	font-size: 0.875em;
 278 | 	padding: 0.5em 0;
 279 | 	line-height: 1.5em;
 280 | }
 281 | .content-box-right-topgrid a{
 282 | 	font-family: 'PT Sans Narrow', sans-serif;
 283 | 	font-size: 1em;
 284 | 	font-weight: 400;
 285 | 	color: #3B3B3B;
 286 | 	text-transform: uppercase;
 287 | 	transition: 0.5s ease;
 288 | 	-o-transition: 0.5s ease;
 289 | 	-webkit-transition: 0.5s ease;
 290 | }
 291 | .content-box-right-topgrid a:hover{
 292 | 	color:#71D6EA;
 293 | }
 294 | .content-box-right-bottomgrid h3{
 295 | 	font-family: 'PT Sans Narrow', sans-serif;
 296 | 	font-size: 1.8em;
 297 | 	font-weight: 400;
 298 | 	color: #71D6EA;
 299 | 	text-transform: uppercase;
 300 | 	border-bottom: 1px solid rgba(85, 85, 85, 0.1);
 301 | 	padding: 1em 0 5px 0;
 302 | 	display: block;
 303 | 	margin: 0 0 0.6em 0;
 304 | }
 305 | .content-box-right-bottomgrid ul li{
 306 | 	display:block;
 307 | }
 308 | .content-box-right-bottomgrid ul li a{
 309 | 	font-family: Arial, Helvetica, sans-serif;
 310 | 	color: #6a6a6a;
 311 | 	font-size: 0.875em;
 312 | 	padding: 0.5em 0;
 313 | 	display: inline-block;
 314 | 	transition: 0.5s ease;
 315 | 	-o-transition: 0.5s ease;
 316 | 	-webkit-transition: 0.5s ease;
 317 | }
 318 | .content-box-right-bottomgrid ul li:before{
 319 | 	content:url(../images/list.png);
 320 | 	padding-right:5px;
 321 | }
 322 | .content-box-right-bottomgrid ul li a:hover{
 323 | 	color:#71D6EA;
 324 | }
 325 | /*-----boxs-----*/
 326 | .boxs {
 327 | 	background: url(../images/box.png);
 328 | 	padding: 1.5em 0 1em 0;
 329 | 	margin: 40px 0px 0 0;
 330 | }
 331 | .box{
 332 | 	width: 29.33%;
 333 | 	float: left;
 334 | }
 335 | .box h3{
 336 | 	font-family: 'PT Sans Narrow', sans-serif;
 337 | 	font-size: 30px;
 338 | 	font-weight: 400;
 339 | 	line-height: 2em;
 340 | 	margin: 0;
 341 | 	text-transform: uppercase;
 342 | 	color: #454545;
 343 | }
 344 | .box span{
 345 | 	display: block;
 346 | 	color: #71D6EA;
 347 | 	font-size: 0.875em;
 348 | 	font-weight: bold;
 349 | 	-webkit-transition: all 0.3s ease-out;
 350 | 	-moz-transition: all 0.3s ease-out;
 351 | 	-ms-transition: all 0.3s ease-out;
 352 | 	-o-transition: all 0.3s ease-out;
 353 | 	transition: all 0.3s ease-out;
 354 | }
 355 | .box span:hover,.box p a:hover{
 356 | 	color:#454545;
 357 | }
 358 | .box p {
 359 | 	font-family: Arial, Helvetica, sans-serif;
 360 | 	color: #6a6a6a;
 361 | 	font-size: 0.875em;
 362 | 	padding: 5px 0 24px 0;
 363 | 	line-height: 1.8em;
 364 | 	width: 89%;
 365 | }
 366 | .box p a{
 367 | 	font-weight:bold;
 368 | 	color: #71D6EA;
 369 | 	-webkit-transition: all 0.3s ease-out;
 370 | 	-moz-transition: all 0.3s ease-out;
 371 | 	-ms-transition: all 0.3s ease-out;
 372 | 	-o-transition: all 0.3s ease-out;
 373 | 	transition: all 0.3s ease-out;
 374 | 	font-family: 'PT Sans Narrow', sans-serif;
 375 | }
 376 | .center-box{
 377 | 	border-right: 1px dashed silver;
 378 | 	border-left: 1px dashed silver;
 379 | 	padding: 0px 40px;
 380 | 	margin-right: 40px;
 381 | }
 382 | .center-box ul li{
 383 | 	display: block;
 384 | 	padding: 0px 0px 10px 0px;
 385 | }
 386 | .center-box ul li a{
 387 | 	font-family: 'PT Sans Narrow', sans-serif;
 388 | 	font-size: 18px;
 389 | 	line-height: 22px;
 390 | 	text-transform: uppercase;
 391 | 	color: #454545;
 392 | 	-webkit-transition: all 0.3s ease-out;
 393 | 	-moz-transition: all 0.3s ease-out;
 394 | 	-ms-transition: all 0.3s ease-out;
 395 | 	-o-transition: all 0.3s ease-out;
 396 | 	transition: all 0.3s ease-out;
 397 | 	font-family: 'PT Sans Narrow', sans-serif;
 398 | }
 399 | .center-box ul li a:hover{
 400 | 	color:#71D6EA;
 401 | }
 402 | .center-box ul li:before{
 403 | 	content:url(../images/marker.png);
 404 | 	padding: 10px;
 405 | }
 406 | .center-box ul{
 407 | 	margin-top:30px;
 408 | }
 409 | /*---start-copy-tight-----*/
 410 | .copy-tight{
 411 | 	text-align: center;
 412 | 	padding: 0px 0px 0.6em 0;
 413 | }
 414 | .copy-tight p{
 415 | 	font-family: 'PT Sans Narrow', sans-serif;
 416 | 	font-size: 1.3em;
 417 | 	font-weight: 400;
 418 | 	color: #3B3B3B;
 419 | 	text-transform: uppercase;
 420 | }
 421 | .copy-tight a{
 422 | 	color: #b36b00;
 423 | 	-webkit-transition: all 0.3s ease-out;
 424 | 	-moz-transition: all 0.3s ease-out;
 425 | 	-ms-transition: all 0.3s ease-out;
 426 | 	-o-transition: all 0.3s ease-out;
 427 | 	transition: all 0.3s ease-out;
 428 | }
 429 | .copy-tight a:hover{
 430 | 	color: #3B3B3B;
 431 | }
 432 | /*---start-about----*/
 433 | /*----start-about-----*/
 434 | .about-grid{
 435 | 	width: 31.33%;
 436 | 	float: left;
 437 | }
 438 | .about-grid h3{
 439 | 	font-family: 'PT Sans Narrow', sans-serif;
 440 | 	font-size: 30px;
 441 | 	font-weight: 400;
 442 | 	line-height: 2em;
 443 | 	margin: 0;
 444 | 	text-transform: uppercase;
 445 | 	color: #454545;
 446 | }
 447 | .about-grid span{
 448 | 	font-family: Arial, Helvetica, sans-serif;
 449 | 	color: #6a6a6a;
 450 | 	font-size: 0.875em;
 451 | 	padding: 5px 0 1px 0;
 452 | 	line-height: 1.5em;
 453 | 	font-weight: bold;
 454 | 	display: block;
 455 | }
 456 | 
 457 | .about-grid p{
 458 | 	font-family: Arial, Helvetica, sans-serif;
 459 | 	color: #6a6a6a;
 460 | 	font-size: 0.875em;
 461 | 	padding: 5px 0 10px 0;
 462 | 	line-height: 1.8em;
 463 | }
 464 | .center-grid1 p{
 465 | 	padding:0px 0px 10px 0px;
 466 | }
 467 | .center-grid1 label{
 468 | 	font-family: 'PT Sans Narrow', sans-serif;
 469 | 	font-size: 18px;
 470 | 	line-height: 22px;
 471 | 	text-transform: uppercase;
 472 | 	color: #71D6EA;
 473 | 	-webkit-transition: all 0.3s ease-out;
 474 | 	-moz-transition: all 0.3s ease-out;
 475 | 	-ms-transition: all 0.3s ease-out;
 476 | 	-o-transition: all 0.3s ease-out;
 477 | 	transition: all 0.3s ease-out;
 478 | 	font-family: 'PT Sans Narrow', sans-serif;
 479 | 	cursor:pointer;
 480 | }
 481 | .center-grid1{
 482 | 	margin:0 3%;
 483 | }
 484 | .center-grid1 label:hover {
 485 | 	color: #454545;
 486 | }
 487 | .about-team-left{
 488 | 	float:left;
 489 | 	width:25%;
 490 | }
 491 | .about-team-right{
 492 | 	float:right;
 493 | 	width: 73%;
 494 | }
 495 | .about-team-right p{
 496 | 	font-family: Arial, Helvetica, sans-serif;
 497 | 	color: #6a6a6a;
 498 | 	font-size: 0.875em;
 499 | 	padding: 0px 0 10px 0;
 500 | 	line-height: 1.8em;
 501 | }
 502 | .client {
 503 | 	padding-bottom: 10px;
 504 | }
 505 | .about-grids {
 506 | 	padding: 10px 0px 0px 0px;
 507 | }
 508 | .about-team-left img {
 509 | 	-webkit-filter: grayscale(100%);
 510 | 	opacity: 5;
 511 | 	transition: all 300ms!important;
 512 | 	-webkit-transition: all 300ms!important;
 513 | 	-moz-transition: all 300ms!important;
 514 | }
 515 | .about-team-left img:hover {
 516 | 	opacity: 1;
 517 | 	-webkit-filter: grayscale(0%);
 518 | 	cursor: pointer;
 519 | }
 520 | .button1 {
 521 | 	font-family: 'PT Sans Narrow', sans-serif;
 522 | 	font-size: 20px;
 523 | 	font-weight: 400;
 524 | 	line-height: 1.2em;
 525 | 	text-decoration: none;
 526 | 	text-transform: uppercase;
 527 | 	margin-right: 15px;
 528 | 	-webkit-transition: all 0.3s ease-out;
 529 | 	-moz-transition: all 0.3s ease-out;
 530 | 	-ms-transition: all 0.3s ease-out;
 531 | 	-o-transition: all 0.3s ease-out;
 532 | 	transition: all 0.3s ease-out;
 533 | 	text-align: center;
 534 | 	margin: 0 auto;
 535 | 	color: #71D6EA;
 536 | 	padding: 12px 0px;
 537 | }
 538 | 
 539 | /*---services----*/
 540 | .service-content h3{
 541 | 	font-family: 'PT Sans Narrow', sans-serif;
 542 | 	font-size: 30px;
 543 | 	font-weight: 400;
 544 | 	line-height: 2em;
 545 | 	margin: 0;
 546 | 	text-transform: uppercase;
 547 | 	color: #454545;
 548 | }
 549 | .service-content ul li{
 550 | 	display: block;
 551 | }
 552 | .service-content ul li span{
 553 | 	width: 5%;
 554 | 	float: left;
 555 | 	font-size: 3em;
 556 | 	color: #454545;
 557 | 	font-family: 'PT Sans Narrow', sans-serif;
 558 | }
 559 | .service-content ul li p{
 560 | 	font-family: Arial, Helvetica, sans-serif;
 561 | 	color: #6a6a6a;
 562 | 	font-size: 0.875em;
 563 | 	padding: 5px 0 10px 0;
 564 | 	line-height: 1.8em;
 565 | }
 566 | .service-content ul li p a{
 567 | 	font-size: 1.2em;
 568 | 	color: #454545;
 569 | 	font-family: 'PT Sans Narrow', sans-serif;
 570 | 	display: block;
 571 | }
 572 | .service-content{
 573 | 	float:left;
 574 | 	width: 74.5%;
 575 | }
 576 | .service-content ul{
 577 | 	padding-bottom:5px;
 578 | }
 579 | .services-sidebar{
 580 | 	float:right;
 581 | 	width:23%;
 582 | }
 583 | .services-sidebar h3{
 584 | 	font-family: 'PT Sans Narrow', sans-serif;
 585 | 	font-size: 30px;
 586 | 	font-weight: 400;
 587 | 	line-height: 2em;
 588 | 	margin: 0;
 589 | 	text-transform: uppercase;
 590 | 	color: #454545;
 591 | }
 592 | .services-sidebar ul li a{
 593 | 	display: block;
 594 | 	font-family: 'PT Sans Narrow', sans-serif;
 595 | 	font-size: 1em;
 596 | 	color: #454545;
 597 | 	padding: 2px 0px 5px 0px;
 598 | 	transition: 0.5s ease;
 599 | 	-o-transition: 0.5s ease;
 600 | 	-webkit-transition: 0.5s ease;
 601 | }
 602 | .services-sidebar ul li a:hover{
 603 | 	color: #71D6EA;
 604 | }
 605 | .services-sidebar ul li {
 606 | 	border-bottom: 1px dashed rgba(192, 192, 192, 0.33);
 607 | 	background: url(../images/marker.png) 0 15px no-repeat;
 608 | 	padding: 9px 13px 8px 23px;
 609 | }
 610 | .services {
 611 | 	padding-top: 10px;
 612 | }
 613 | /*---start-gallery---*/
 614 | .gallerys {
 615 | 	padding-top: 10px;
 616 | }
 617 | .gallerys h3{
 618 | 	font-family: 'PT Sans Narrow', sans-serif;
 619 | 	font-size: 30px;
 620 | 	font-weight: 400;
 621 | 	line-height: 2em;
 622 | 	margin: 0;
 623 | 	text-transform: uppercase;
 624 | 	color: #454545;
 625 | }
 626 | .gallery-grid{
 627 | 	width: 31.44%;
 628 | 	float:left;
 629 | }
 630 | .gallery-grid p {
 631 | 	font-size: 0.875em;
 632 | 	padding: 0.2em 0em 1.2em 0em;
 633 | 	color: #6a6a6a;
 634 | 	line-height: 1.8em;
 635 | 	font-family: Arial, Helvetica, sans-serif;
 636 | }
 637 | .gallery-button a {
 638 | 	font-family: 'PT Sans Narrow', sans-serif;
 639 | 	font-size: 20px;
 640 | 	font-weight: 400;
 641 | 	line-height: 1.2em;
 642 | 	text-decoration: none;
 643 | 	text-transform: uppercase;
 644 | 	margin-right: 15px;
 645 | 	-webkit-transition: all 0.3s ease-out;
 646 | 	-moz-transition: all 0.3s ease-out;
 647 | 	-ms-transition: all 0.3s ease-out;
 648 | 	-o-transition: all 0.3s ease-out;
 649 | 	transition: all 0.3s ease-out;
 650 | 	text-align: center;
 651 | 	margin: 0 auto;
 652 | 	color: #71D6EA;
 653 | 	padding: 12px 0px;
 654 | }
 655 | .gallery-button a:hover {
 656 | 	color:#454545;
 657 | }
 658 | .grid2{
 659 | 	margin: 0px 20px;
 660 | }
 661 | .gallery-grids {
 662 | 	margin-bottom: 30px;
 663 | }
 664 | .projects-bottom-paination ul li{
 665 | 	display:inline-block;
 666 | }
 667 | .projects-bottom-paination{
 668 | 	text-align: center;
 669 | 	padding-top: 55px;
 670 | }
 671 | .projects-bottom-paination li a{
 672 | 	font: 400 12px/1.2em Arial;
 673 | 	color: #5a5a5a;
 674 | 	padding: 11px 18px;
 675 | 	background: #fff;
 676 | 	text-decoration: none;
 677 | 	text-shadow: none;
 678 | 	border: 1px solid #e9e9e9;
 679 | 	margin-top: 16px;
 680 | }
 681 | .projects-bottom-paination li.active> a, .projects-bottom-paination li> a:hover {
 682 | 	background: #71D6EA;
 683 | 	color:#fff;
 684 | }
 685 | .gallery-grid h4{
 686 | 	font-family: 'PT Sans Narrow', sans-serif;
 687 | 	font-size: 18px;
 688 | 	line-height: 22px;
 689 | 	text-transform: uppercase;
 690 | 	color: #454545;
 691 | 	-webkit-transition: all 0.3s ease-out;
 692 | 	-moz-transition: all 0.3s ease-out;
 693 | 	-ms-transition: all 0.3s ease-out;
 694 | 	-o-transition: all 0.3s ease-out;
 695 | 	transition: all 0.3s ease-out;
 696 | 	font-family: 'PT Sans Narrow', sans-serif;
 697 | 	cursor: pointer;
 698 | 	padding: 13px 0px 2px 0px;
 699 | }
 700 | .gallery-grid h4:hover{
 701 | 	color:#71D6EA;
 702 | }
 703 | /*---contect----*/
 704 | /*  Contact Form  ============================================================================= */
 705 | .section {
 706 | 	clear: both;
 707 | 	padding: 0px;
 708 | 	margin: 0px;
 709 | }
 710 | .group:before,
 711 | .group:after {
 712 |     content:"";
 713 |     display:table;
 714 | }
 715 | .group:after {
 716 |     clear:both;
 717 | }
 718 | .group {
 719 |     zoom:1;
 720 | }
 721 | .col{
 722 | 	display: block;
 723 | 	float:left;
 724 | 	margin: 1% 0 1% 1.6%;
 725 | }
 726 | .col:first-child{
 727 | 	margin-left:0;
 728 | }	
 729 | .span_2_of_3 {
 730 | 	width: 63.1%;
 731 | 	padding:1.5%; 
 732 | }
 733 | .span_1_of_3 {
 734 | 	width: 29.2%;
 735 | 	padding:1.5%; 
 736 | }
 737 | .span_2_of_3  h3,
 738 | .span_1_of_3  h3 {
 739 | 	font-family: 'PT Sans Narrow', sans-serif;
 740 | 	font-size: 30px;
 741 | 	font-weight: 400;
 742 | 	line-height: 2em;
 743 | 	margin: 0;
 744 | 	text-transform: uppercase;
 745 | 	color: #454545;
 746 | }
 747 | .contact-form{
 748 | 	position:relative;
 749 | 	padding-bottom:30px;
 750 | }
 751 | .contact-form div{
 752 | 	padding:5px 0;
 753 | }
 754 | .contact-form span{
 755 | 	display:block;
 756 | 	font-size:1em;
 757 | 	color: #454545;
 758 | 	padding-bottom:5px;
 759 | 	font-family: 'PT Sans Narrow', sans-serif;
 760 | }
 761 | .contact-form input[type="text"],.contact-form textarea{
 762 | 		    padding:8px;
 763 | 			display:block;
 764 | 			width:98%;
 765 | 			border: none;
 766 | 			outline:none;
 767 | 			color:#464646;
 768 | 			font-size:0.8125em;
 769 | 			font-family:Arial, Helvetica, sans-serif;
 770 | 			border: 1px solid rgba(192, 192, 192, 0.41);
 771 | 			-webkit-appearance:none;
 772 | }
 773 | .contact-form textarea{
 774 | 		resize:none;
 775 | 		height:120px;		
 776 | }
 777 | .contact-form input[type="submit"]{
 778 | 	font-family: 'PT Sans Narrow', sans-serif;
 779 | 	font-size: 20px;
 780 | 	font-weight: 400;
 781 | 	line-height: 1.2em;
 782 | 	text-decoration: none;
 783 | 	text-transform: uppercase;
 784 | 	margin-right: 15px;
 785 | 	-webkit-transition: all 0.3s ease-out;
 786 | 	-moz-transition: all 0.3s ease-out;
 787 | 	-ms-transition: all 0.3s ease-out;
 788 | 	-o-transition: all 0.3s ease-out;
 789 | 	transition: all 0.3s ease-out;
 790 | 	text-align: center;
 791 | 	margin: 0 auto;
 792 | 	color: #71D6EA;
 793 | 	border:none;
 794 | 	outline: none;
 795 | 	background:none;
 796 | 	cursor:pointer;
 797 | }
 798 | .contact-form input[type="submit"]:hover{
 799 | 	color: #454545;
 800 | }
 801 | .contact-form input[type="submit"]:active{
 802 | 	color: #454545;
 803 | }
 804 | .company_address{
 805 | }
 806 | .company_address p{
 807 | 	font-size: 0.875em;
 808 | 	color: #6a6a6a;
 809 | 	line-height: 1.8em;
 810 | 	font-family: Arial, Helvetica, sans-serif;
 811 | }
 812 | .company_address p span{
 813 | 	text-decoration:underline;
 814 | 	color:#454545;
 815 | 	cursor:pointer;
 816 | }
 817 | .map{
 818 | 	margin-bottom:15px;
 819 | }
 820 | 
 821 | /***** Media Quries *****/
 822 | @media only screen and (max-width: 1024px) {
 823 | 	.wrap{
 824 | 		width:95%;
 825 | 	}	
 826 | }
 827 | /*  GO FULL WIDTH AT LESS THAN 800 PIXELS */
 828 | 
 829 | @media only screen and (max-width: 800px) {
 830 | 	.wrap{
 831 | 		width:95%;
 832 | 	}
 833 | 	.span_2_of_3 {
 834 | 		width:94%;
 835 | 		padding:3%; 
 836 | 	}
 837 | 	.col{ 
 838 | 		margin: 1% 0 1% 0%;
 839 | 	}
 840 | 	.span_1_of_3 {
 841 | 		width:94%;
 842 | 		padding:3%; 
 843 | 	}
 844 | }
 845 | 
 846 | /*  GO FULL WIDTH AT LESS THAN 640 PIXELS */
 847 | 
 848 | @media only screen and (max-width: 640px) and (min-width: 480px) {
 849 | 	.wrap{
 850 | 		width:95%;
 851 | 	}
 852 | 	.span_2_of_3 {
 853 | 		width:94%;
 854 | 		padding:3%; 
 855 | 	}
 856 | 	.col{ 
 857 | 		margin: 1% 0 1% 0%;
 858 | 	}
 859 | 	.span_1_of_3 {
 860 | 		width:94%;
 861 | 		padding:3%; 
 862 | 	}
 863 |    
 864 |    .contact-form input[type="text"],.contact-form textarea{
 865 | 		width:97%;
 866 | 	}
 867 | }
 868 | /*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
 869 | 
 870 | @media only screen and (max-width: 480px) {
 871 | 	.wrap{
 872 | 		width:95%;
 873 | 	}
 874 | 	.span_2_of_3 {
 875 | 		width:90%;
 876 | 		padding:5%; 
 877 | 	}
 878 | 	.col { 
 879 | 		margin: 1% 0 1% 0%;
 880 | 	}
 881 | 	.span_1_of_3 {
 882 | 		width:90%;
 883 | 		padding:5%; 
 884 | 	}
 885 | 	.contact-form input[type="text"],.contact-form textarea{
 886 | 		width:92%;
 887 | 	}
 888 | }
 889 | .contact-footer{
 890 | 	border-top: 1px solid rgba(69, 69, 69, 0.13);
 891 | 	padding: 28px 0px 0px 0px;
 892 | }
 893 | /*----responsive-design-----*/
 894 | @media only screen and (max-width: 1366px) and (min-width: 1280px) {
 895 | 	.wrap{
 896 | 		width:90%;
 897 | 	}
 898 | 	.header-top-nav ul li a {
 899 | 		padding: 11px 89px;
 900 | 	}
 901 | 	.quit p {
 902 | 		width: 70%;
 903 | 	}
 904 | 	.center-box ul li a {
 905 | 		font-size: 17px;
 906 | 	}
 907 | 	.gallery-grid {
 908 | 		width: 31.3%;
 909 | 	}
 910 | }
 911 | @media only screen and (max-width: 1280px) and (min-width: 1024px) {
 912 | 	.wrap{
 913 | 		width:90%;
 914 | 	}
 915 | 	.header-top-nav ul li a {
 916 | 		padding: 11px 81px;
 917 | 	}
 918 | 	.quit p {
 919 | 		width: 70%;
 920 | 	}
 921 | 	.center-box ul li a {
 922 | 		font-size: 16px;
 923 | 	}
 924 | 	.gallery-grid {
 925 | 		width: 31.2%;
 926 | 	}
 927 | 	.boxs {
 928 | 		padding: 0.5em 0 0.6em 0;
 929 | 	}
 930 | }
 931 | @media only screen and (max-width: 1024px) and (min-width: 768px) {
 932 | 	.wrap{
 933 | 		width:90%;
 934 | 	}
 935 | 	.header-top-nav ul li a {
 936 | 		padding: 11px 58.5px;
 937 | 	}
 938 | 	.quit p {
 939 | 		width: 70%;
 940 | 	}
 941 | 	.center-box ul li a {
 942 | 		font-size: 16px;
 943 | 	}
 944 | 	.gallery-grid {
 945 | 		width: 30%;
 946 | 	}
 947 | 	.boxs {
 948 | 		padding: 0.5em 0 0em 0;
 949 | 	}
 950 | 	.quit p {
 951 | 		font-size: 1.5em;
 952 | 	}
 953 | 	.content-grids {
 954 | 		padding: 1.5em 0 0.7em 0;
 955 | 	}
 956 | 	.content-grid-info h3 {
 957 | 		font-size: 1.4em;
 958 | 	}
 959 | 	.content-box-left-topgrid span {
 960 | 		font-size: 1.4em;
 961 | 	}
 962 | 	.box {
 963 | 		width:28%;
 964 | 	}
 965 | 	.box h3 {
 966 | 		line-height: 1.2em;
 967 | 		padding-bottom:0.2em;
 968 | 	}
 969 | 	.center-box {
 970 | 		margin-right: 40px;
 971 | 	}
 972 | 	.center-box ul li:nth-child(1){
 973 | 		display:none;
 974 | 	}
 975 | 	.content-box-left-topgrid p:nth-child(3){
 976 | 		display:none;
 977 | 	}
 978 | 	.gallery-grid p {
 979 | 		padding: 0.2em 0em 0.5em 0em;
 980 | 	}
 981 | 	.service-content ul li span {
 982 | 		height: 81px;
 983 | 	}
 984 | }
 985 | @media only screen and (max-width: 768px) and (min-width: 640px) {
 986 | 	.wrap{
 987 | 		width:90%;
 988 | 	}
 989 | 	.header-top-nav ul li a {
 990 | 		padding: 11px 36px;
 991 | 	}
 992 | 	.quit p {
 993 | 		width: 80%;
 994 | 	}
 995 | 	.content-grid-info {
 996 | 		width: 67.5%;
 997 | 	}
 998 | 	.center-box ul li a {
 999 | 		font-size: 16px;
1000 | 	}
1001 | 	.gallery-grid {
1002 | 		width: 29%;
1003 | 	}
1004 | 	.quit p {
1005 | 		font-size: 1.5em;
1006 | 	}
1007 | 	.content-grids {
1008 | 		padding: 1.5em 0 0.7em 0;
1009 | 	}
1010 | 	.content-grid-info h3 {
1011 | 		font-size: 1.4em;
1012 | 	}
1013 | 	.content-box-left-topgrid span {
1014 | 		font-size: 1.4em;
1015 | 	}
1016 | 	.box {
1017 | 		width:28%;
1018 | 	}
1019 | 	.box h3 {
1020 | 		line-height: 1.2em;
1021 | 		padding-bottom:0.2em;
1022 | 	}
1023 | 	.center-box {
1024 | 		margin-right: 40px;
1025 | 	}
1026 | 	.center-box ul li:nth-child(1){
1027 | 		display:none;
1028 | 	}
1029 | 	.content-box-left-topgrid p:nth-child(3){
1030 | 		display:none;
1031 | 	}
1032 | 	.gallery-grid p {
1033 | 		padding: 0.2em 0em 0.5em 0em;
1034 | 	}
1035 | 	.service-content ul li span {
1036 | 		height: 81px;
1037 | 	}
1038 | 	.boxs{
1039 | 		display:none;
1040 | 	}
1041 | 	.content-box-left-bootomgrid h3 {
1042 | 		font-size: 1.1em;
1043 | 	}
1044 | 	.content-box-right-bottomgrid ul li a {
1045 | 		font-size: 0.8em;
1046 | 	}
1047 | 	.content-box-right-topgrid h3 {
1048 | 		font-size: 1.4em;
1049 | 	}
1050 | 	.content-box-right-bottomgrid h3 {
1051 | 		font-size: 1.4em;
1052 | 	}
1053 | 	.content-box-left-topgrid span {
1054 | 		width: 96%;
1055 | 	}
1056 | 	.content-box-left-topgrid h3 {
1057 | 		font-size: 1.4em;
1058 | 	}
1059 | 	.about-grid {
1060 | 		width: 100%;
1061 | 		float:none;
1062 | 	}
1063 | 	.center-grid1 {
1064 | 		margin: 0;
1065 | 	}
1066 | 	.about-team-right {
1067 | 		width: 82%;
1068 | 	}
1069 | 	.about-team-left {
1070 | 		width: 17%;
1071 | 	}
1072 | 	.service-content ul li span {
1073 | 		width: 8%;
1074 | 	}
1075 | 	.projects-bottom-paination {
1076 | 		padding:30px 0;
1077 | 	}
1078 | }
1079 | 
1080 | 
1081 | 
1082 | 


--------------------------------------------------------------------------------
/database.php:
--------------------------------------------------------------------------------
1 | <?php
2 | $connect=mysqli_connect('localhost','root','','mydatabase');
3 | 
4 | if(mysqli_connect_errno($connect))
5 | {
6 | 		echo 'Failed to connect';
7 | }
8 | 
9 | ?>


--------------------------------------------------------------------------------
/gallery.html:
--------------------------------------------------------------------------------
  1 | <!--
  2 | Author: Syed Ibrahim
  3 | Author URL: http://zeeshanovic.blogspot.com
  4 | -->
  5 | <!DOCTYPE HTML>
  6 | <html>
  7 | 	<head>
  8 | 		<title>Hotel Website | Gallery</title>
  9 | 		<link href="css/style.css" rel="stylesheet" type="text/css"  media="all" />
 10 | 		<link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow' rel='stylesheet' type='text/css'>
 11 | 		<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
 12 | 	</head>
 13 | 	<body>
 14 | 		<!---start-Wrap--->
 15 | 			<!---start-header--->
 16 | 			<div class="header">
 17 | 				<div class="wrap">
 18 | 					<div class="header-top">
 19 | 						<div class="logo">
 20 | 							<a href="index.html"><img src="images/logo2.png" title="logo" /></a>
 21 | 						</div>
 22 |                         <img src="images/marriott_logo.jpg" align="center" width=700px height=150 px>
 23 | 						<div class="contact-info">
 24 | 							<a href = "contact.html" target = "_self"> 
 25 | 								<img src = "/images/contact-us.png" alt = "contact-us" width=300px height=50px border = "0"/> 
 26 | 							<p class="phone">Call us : <a href="#">98xxxxxxxx</a></p>
 27 | 							<p class="gps">Gps : <a href="#top123">View map</a></p>
 28 | 							<p class="code">BROUGHT TO YOU BY:<a href="https:zeeshanovic.blogspot.com">Syed Ibrahim</a></p>
 29 | 						</div>
 30 | 						<div class="clear"> </div>
 31 | 					</div>
 32 | 				</div>
 33 | 				<div class="header-top-nav">
 34 | 					<div class="wrap">
 35 | 						<ul>
 36 | 							<li><a href="index.html">Home</a></li>
 37 | 							<li><a href="about.html">About</a></li>
 38 | 							<li><a href="services.html">Services</a></li>
 39 | 							<li class="active"><a href="gallery.html">Gallery</a></li>
 40 | 							<div class="clear"> </div>
 41 | 						</ul>
 42 | 					</div>
 43 | 				</div>
 44 | 			</div>
 45 | 			<!---End-header--->
 46 | 			<div class="clear"> </div>
 47 | 			<!---start-content----->
 48 | 			<div class="content">
 49 | 				<div class="wrap">
 50 | 					<!----start-image-gallery----->
 51 | 					<div class="gallerys">
 52 | 					<h3>gallery</h3>
 53 | 					<div class="gallery-grids">
 54 | 						<div class="gallery-grid">
 55 | 							<img src="images/slider1.jpg" alt="">
 56 | 							<h4>Deluxe prime</h4>
 57 | 							<p>With king size bed</p>
 58 | 							<div class="gallery-button"><a href="#" onclick="myFunction()">Book Now</a></div>
 59 | 						</div>
 60 | 						<div class="gallery-grid grid2">
 61 | 							<img src="images/slider3.jpg" alt="">
 62 | 							<h4>Deluxe supreme</h4>
 63 | 							<p>Two queen size bed</p>
 64 | 							<div class="gallery-button"><a href="#" onclick="myFunction()">Book Now</a></div>
 65 | 						</div>
 66 | 						<div class="gallery-grid">
 67 | 							<img src="images/imperialclub-hero-2x1.jpg" height=125px width=450px alt="">
 68 | 							<h4>Imperial Club Room</h4>
 69 | 							<p>For those seeking additional luxury and comfort</p>
 70 | 							<div class="gallery-button"><a href="#" onclick="myFunction()">Book Now</a></div>
 71 | 						</div>
 72 | 						<div class="clear"> </div>
 73 | 					</div>
 74 | 					<div class="clear"> </div>
 75 | 					<div class="gallery-grids">
 76 | 						<div class="gallery-grid">
 77 | 							<img src="images/terraceclubsuite-hero-2x1.jpg"  height=125px width=450px alt="">
 78 | 							<h4>Terrace Club Suite</h4>
 79 | 							<p> The Terrace Club Suite has beautiful and spacious terraces, perfect for sunbathing or al fresco dining.</p>
 80 | 							<div class="gallery-button"><a href="#" onclick="myFunction()">Book Now</a></div>
 81 | 						</div>
 82 | 						<div class="gallery-grid grid2">
 83 | 							<img src="images/executiveclubsuite-hero-2x1.jpg" height=125px width=450px alt="">
 84 | 							<h4>Executive Club Suite</h4>
 85 | 							<p>The Executive Club Suite is the perfect balance of comfort and luxury.</p>
 86 | 							<div class="gallery-button"><a href="#" onclick="myFunction()">Book Now</a></div>
 87 | 						</div>
 88 | 						<div class="gallery-grid">
 89 | 							<img src="images/regalclubsuite-hero-2x1.jpg" height=125px width=450px alt height=125px width=450px="">
 90 | 							<h4>Regal Club Suite</h4>
 91 | 							<p>The Regal Club Suite offers a lavish sanctuary with plenty of room to relax, rejuvenate and entertain.</p>
 92 | 							<div class="gallery-button"><a href="#" onclick="myFunction()">Book Now</a></div>
 93 | 						</div>
 94 | 					</div>
 95 | 					<script type="text/javascript" src="js/jquery.lightbox.js"></script>
 96 | 				    <link rel="stylesheet" type="text/css" href="css/lightbox.css" media="screen">
 97 | 				  	<script type="text/javascript">
 98 | 				    $(function() {
 99 | 				        $('.gallery-grid a').lightBox();
100 | 				    });
101 | 				    </script>
102 | 				    <div class="clear"> </div>
103 | 				    <div class="projects-bottom-paination">
104 | 						<ul>
105 | 							<li class="active"><a href="#">1</a></li>
106 | 							<li><a href="#">2</a></li>
107 | 						</ul>
108 | 					</div>
109 | 				</div>
110 | 					<!----start-image-gallery----->
111 | 				</div>
112 | 				<div class="clear"> </div>
113 | 				<div class="boxs">
114 | 				<div class="wrap">
115 | 				<div class="box">
116 | 				
117 | 				</div>
118 | 				<div class="box center-box">
119 | 					<ul>
120 | 						<li><a href="#" onclick="myFunction()">Leave a Feedback</a></li>
121 | 						<li><a href="#" onclick="myFunction1()">Reviews and Ratings</a></li>
122 | 						<li><a href="gallery.html">gallery</a></li>
123 | 						<li><a href="services.html">Services</a></li>
124 | 						<li><a href="https:www.quora.com/What-is-trekking">Know about Moutaineering and trekking here</a></li>
125 | 						<li><a href="https:zeeshanovic.blogspot.com">zeeshanovic.blogspot.com</a></li>
126 | 					</ul>
127 | 				</div>
128 |                     <div id="top123"> 
129 |                           <img src="images/map Manila Marriott Hotel.JPG" height=200px width=450px height=125px width=450px align= rights>
130 |                     </div>
131 | 				<div class="box">
132 | 					
133 | 				</div>
134 | 				<div class="clear"> </div>
135 | 			</div>
136 | 			<!---start-box---->
137 | 		</div>
138 | 		<!---start-copy-Right----->
139 | 		<div class="copy-tight">
140 | 			<p>&copy HOTEL Awesome,Demo Land 2018</p>
141 | 		</div>
142 | 		<!---End-copy-Right----->
143 | 			</div>
144 | 			<!---End-content----->
145 | 		</div>
146 | 		<!---End-Wrap--->
147 |     <script>
148 | function myFunction() {
149 |     var person = prompt("Please enter your mobile number", "9xxxxxxxxx");
150 |    var r =confirm("The price is Rs.1200\n Press ok to continue");
151 |     if (person != null&& r== true) {
152 |         alert("Dear customer, Thank You for booking the room!!!");
153 |     }
154 | }
155 | </script>
156 | 	</body>
157 | </html>
158 | 
159 | 


--------------------------------------------------------------------------------
/images/.DS_Store:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/.DS_Store


--------------------------------------------------------------------------------
/images/ECOMMERCE_Icons_Service-512.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/ECOMMERCE_Icons_Service-512.png


--------------------------------------------------------------------------------
/images/Thumbs.db:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/Thumbs.db


--------------------------------------------------------------------------------
/images/box-bg.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/box-bg.png


--------------------------------------------------------------------------------
/images/box.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/box.png


--------------------------------------------------------------------------------
/images/box1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/box1.png


--------------------------------------------------------------------------------
/images/c1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/c1.jpg


--------------------------------------------------------------------------------
/images/c2.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/c2.jpg


--------------------------------------------------------------------------------
/images/contact-us.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/contact-us.png


--------------------------------------------------------------------------------
/images/executiveclubsuite-hero-2x1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/executiveclubsuite-hero-2x1.jpg


--------------------------------------------------------------------------------
/images/header-bg.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/header-bg.png


--------------------------------------------------------------------------------
/images/icon1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/icon1.png


--------------------------------------------------------------------------------
/images/icon2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/icon2.png


--------------------------------------------------------------------------------
/images/imperialclub-hero-2x1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/imperialclub-hero-2x1.jpg


--------------------------------------------------------------------------------
/images/iocn3.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/iocn3.png


--------------------------------------------------------------------------------
/images/lightbox-btn-close.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/lightbox-btn-close.gif


--------------------------------------------------------------------------------
/images/lightbox-btn-next.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/lightbox-btn-next.gif


--------------------------------------------------------------------------------
/images/lightbox-ico-loading.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/lightbox-ico-loading.gif


--------------------------------------------------------------------------------
/images/list.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/list.png


--------------------------------------------------------------------------------
/images/logo2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/logo2.png


--------------------------------------------------------------------------------
/images/map Manila Marriott Hotel.JPG:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/map Manila Marriott Hotel.JPG


--------------------------------------------------------------------------------
/images/mark1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/mark1.png


--------------------------------------------------------------------------------
/images/marker.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/marker.png


--------------------------------------------------------------------------------
/images/marriott_logo.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/marriott_logo.jpg


--------------------------------------------------------------------------------
/images/phone.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/phone.png


--------------------------------------------------------------------------------
/images/pointer.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/pointer.png


--------------------------------------------------------------------------------
/images/quote-1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/quote-1.png


--------------------------------------------------------------------------------
/images/quote-2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/quote-2.png


--------------------------------------------------------------------------------
/images/regalclubsuite-hero-2x1 - Copy.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/regalclubsuite-hero-2x1 - Copy.jpg


--------------------------------------------------------------------------------
/images/regalclubsuite-hero-2x1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/regalclubsuite-hero-2x1.jpg


--------------------------------------------------------------------------------
/images/slider1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/slider1.jpg


--------------------------------------------------------------------------------
/images/slider2.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/slider2.jpg


--------------------------------------------------------------------------------
/images/slider3.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/slider3.jpg


--------------------------------------------------------------------------------
/images/special.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/special.jpg


--------------------------------------------------------------------------------
/images/terraceclubsuite-hero-2x1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/terraceclubsuite-hero-2x1.jpg


--------------------------------------------------------------------------------
/images/top-nav-bg.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/K-0817/Hotel-site/e0e6980bdb14e183a962edcf737b079bf5bc905d/images/top-nav-bg.png


--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
  1 | <!--
  2 | Author: Syed Ibrahim
  3 | Author URL: http://zeeshanovic.blogspot.com
  4 | -->
  5 | <!DOCTYPE HTML>
  6 | <html>
  7 | 	<head>
  8 | 		<title>Hotel Website | Home</title>
  9 | 		<link href="css/style.css" rel="stylesheet" type="text/css"  media="all" />
 10 | 		<link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow' rel='stylesheet' type='text/css'>
 11 | 		<link rel="stylesheet" href="css/responsiveslides.css">
 12 | 		<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
 13 | 		<script src="js/responsiveslides.min.js"></script>
 14 | 		  <script>
 15 | 		   $(function () {
 16 | 			      $("#slider1").responsiveSlides({
 17 | 			        maxwidth: 1600,
 18 | 			        speed: 600
 19 | 			      });
 20 | 			});
 21 | 		  </script>
 22 | 	</head>
 23 | 	<body>
 24 | 		<!---start-Wrap--->
 25 | 			<!---start-header--->
 26 | 			<div class="header">
 27 | 				<div class="wrap">
 28 | 					<div class="header-top">
 29 | 						<div class="logo">
 30 | 							<a href="index.html"><img src="images/logo2.png" title="logo" /></a>
 31 | 						</div>
 32 |                         <img src="images/marriott_logo.jpg" align="center" width=700px height=150 px>
 33 | 						<div class="contact-info">
 34 | 							<a href = "contact.html" target = "_self"> 
 35 | 								<img src = "/images/contact-us.png" alt = "contact-us" width=300px height=50px border = "0"/> 
 36 | 							<p class="phone">Call us : <a href="#">98xxxxxxxx</a></p>
 37 | 							<p class="gpa">Gps : <a href="#top123">View map</a></p>
 38 | 							<p class="code">BROUGHT TO YOU BY:<a href="https:zeeshanovic.blogspot.com">Syed Ibrahim</a></p>
 39 | 
 40 | 						</div>
 41 | 						<div class="clear"> </div>
 42 | 					</div>
 43 | 				</div>
 44 | 				<div class="header-top-nav">
 45 | 					<div class="wrap">
 46 | 						<ul>
 47 | 							<li class="active"><a href="index.html">Home</a></li>
 48 | 							<li><a href="about.html">About</a></li>
 49 | 							<li><a href="services.html">Services</a></li>
 50 | 							<li><a href="gallery.html">Gallery</a></li>
 51 | 							
 52 | 							<div class="clear"> </div>
 53 | 						</ul>
 54 | 					</div>
 55 | 				</div>
 56 | 			</div>
 57 | 			<!---End-header--->
 58 | 			<div class="clear"> </div>
 59 | 			<!--start-image-slider---->
 60 | 					<div class="image-slider">
 61 | 						<!-- Slideshow 1 -->
 62 | 						    <ul class="rslides" id="slider1">
 63 | 						      <li><img src="images/slider3.jpg" alt=""></li>
 64 | 						      <li><img src="images/slider1.jpg" alt=""></li>
 65 | 						      <li><img src="images/slider3.jpg" alt=""></li>
 66 | 						    </ul>
 67 | 						 <!-- Slideshow 2 -->
 68 | 					</div>
 69 | 					<!--End-image-slider---->
 70 | 			<!---start-content----->
 71 | 			<div class="content">
 72 | 				<div class="quit">
 73 | 					<p><span class="start">Live </span> Life <span class="end">King Size </span></p>
 74 | 				</div>
 75 | 					<div class="content-grids">
 76 | 						<div class="wrap">
 77 | 						<div class="content-grid">
 78 | 							<div class="content-grid-pic">
 79 | 								<a href="#"><img src="images/icon1.png" title="image-name" /></a>
 80 | 							</div>
 81 | 							<div class="content-grid-info">
 82 | 								<h3>Best food Ever</h3>
 83 | 								<p>"Rotting melons, dried-up mustard,<br>
 84 | Eggshells mixed with lemon custard,<br>
 85 | Cold French fries and rancid meat,<br>
 86 | Yellow lumps of Cream of Wheat. . ."</p>
 87 | 								<a href="https:swiggy.com">Read More</a>
 88 | 							</div>
 89 | 							<div class="clear"> </div>
 90 | 						</div>
 91 | 						<div class="content-grid">
 92 | 							<div class="content-grid-pic">
 93 | 								<a href="#"><img src="images/icon2.png" title="image-name" /></a>
 94 | 							</div>
 95 | 							<div class="content-grid-info">
 96 | 								<h3>24x7 phone support</h3>
 97 | 								<p>"customer is King<br> At your Serive."</p>
 98 | 								<a href="contact.html">Read More</a>
 99 | 							</div>
100 | 							<div class="clear"> </div>
101 | 						</div>
102 | 						<div class="content-grid">
103 | 							<div class="content-grid-pic">
104 | 								<a href="#"><img src="images/iocn3.png" title="image-name" /></a>
105 | 							</div>
106 | 							<div class="content-grid-info">
107 | 								<h3>Best Room Services</h3>
108 | 								<p>"live life king size with<br>
109 |                                     all the services at your room"</p>
110 | 								<a href="services.html">Read More</a>
111 | 							</div>
112 | 							<div class="clear"> </div>
113 | 						</div>
114 | 						
115 | 						<div class="clear"> </div>
116 | 					</div>
117 | 				</div>
118 | 				<div class="clear"> </div>
119 | 				<div class="content-box">
120 | 					<div class="wrap">
121 | 					<div class="content-box-left">
122 | 						<div class="content-box-left-topgrid">
123 | 							<h3>welcome to our Hotel</h3>
124 | 							<p><ul> Feel Like Home :) </ul> </p>
125 | 							<p> Whether you are staying with us, visiting our marine & water park attractions for the day or dining in one of our award-winning restaurants, Atlantis promises to deliver extraordinary experiences. We are very excited to bring to you a wide range of new and exciting entertainment options that you must try during your visit.</p>
126 | 							<span>For more information about our Hotel, Call 98xxxxxxxx</span>
127 | 						</div>
128 | 						<div class="content-box-left-bootomgrids">
129 | 							<div class="content-box-left-bootomgrid">
130 | 								<h3><ul>Deluxe Rooms</ul></h3>
131 | 								<p>Guest room, 1 King or 2 Twin/Single Bed(s)</p>
132 | 								<a href="#"><img src="images/slider1.jpg" title="image-name" /></a>
133 | 							</div>
134 | 							<div class="content-box-left-bootomgrid">
135 | 								<h3><ul>Luxury Rooms</ul></h3>
136 | 								<p>Guest room, 1 King or 2 Twin/Single Bed(s), Pool access, Balcony</p>
137 | 								<a href="#"><img src="images/slider2.jpg" title="image-name" /></a>
138 | 							</div>
139 | 							<div class="content-box-left-bootomgrid lastgrid">
140 | 								<h3><ul>Executive Rooms</ul></h3>
141 | 								<p>Club lounge access, Guest room, 1 King or 2 Double</p>
142 | 								<a href="#"><img src="images/slider3.jpg" title="image-name" /></a>
143 | 							</div>
144 | 							<div class="clear"> </div>
145 | 						</div>
146 | 						<div class="clear"> </div>
147 | 					</div>
148 | 					<div class="content-box-right">
149 | 						<div class="content-box-right-topgrid">
150 | 							<h3>To days Specials</h3>
151 | 							<a href="#"><img src="images/slider1.jpg" title="imnage-name" /></a>
152 | 							<h4>Super Discount Offer</h4>
153 | 							<p>"For those seeking additional luxury and comfort<br>
154 | <u>Size:</u> 45 - 47 square metres<br>
155 | <u>Views:</u>  The Palm or Aquaventure<br>
156 | <u>Occupancy:</u> 2 adults + 2 children<br>
157 | <u>Bed type:</u>  a king size bed or queen size beds"</p>
158 | 							<a href="gallery.html">Read More</a>
159 | 						</div>
160 | 						<div class="content-box-right-bottomgrid">
161 | 							
162 | 						</div>
163 | 					</div>
164 | 					<div class="clear"> </div>
165 | 				</div>
166 | 				<div class="clear"> </div>
167 | 				<div class="boxs">
168 | 				<div class="wrap">
169 | 				<div class="box">
170 | 			
171 | 				</div>
172 | 				<div class="box center-box">
173 | 					<ul>
174 | 						<li><a href="#" onclick="myFunction()">Leave a Feedback</a></li>
175 | 						<li><a href="#" onclick="myFunction1()">Reviews and Ratings</a></li>
176 | 						<li><a href="gallery.html">gallery</a></li>
177 | 						<li><a href="services.html">Services</a></li>
178 | 						<li><a href="https:www.quora.com/What-is-trekking">Know about Moutaineering and trekking here</a></li>
179 | 						<li><a href="https:zeeshanovic.blogspot.com">zeeshanovic.blogspot.com</a></li>
180 | 					</ul>
181 | 				</div>
182 |                      <div id="top123"> 
183 |                           <img src="images/map Manila Marriott Hotel.JPG" height=200px width=450px height=125px width=450px align= rights>
184 |                     </div>
185 | 		
186 | 				<div class="clear"> </div>
187 | 			</div>
188 | 			<!---start-box---->
189 | 		</div>
190 | 		<!---start-copy-Right----->
191 | 		<div class="copy-tight">
192 | 			<p>&copy HOTEL Awesome,Demo Land 2018</p>
193 | 		</div>
194 | 		<!---End-copy-Right----->
195 | 			</div>
196 | 			<!---End-content----->
197 | 		</div>
198 | 		<!---End-Wrap--->
199 |     <script>
200 | function myFunction() {
201 |     var person = prompt("Please enter your valuable feedback", "......");
202 |     if (person != null) {
203 |         alert("Thank you for your response! Have a nice day");
204 |         
205 |         function myFunction1() {
206 |     var person = prompt("Please give your review", "......");
207 |     if (person != null) {
208 |         alert("Thank you for reviewing us!!!");
209 | 
210 |     }
211 | }
212 | </script>
213 | 	</body>
214 | </html>
215 | 
216 | 


--------------------------------------------------------------------------------
/index.php:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html>
 3 | <head>
 4 | 
 5 | <title>Hotel Website | Gallery</title>
 6 | <style>
 7 | label{display:inline-block;width:100px;margin-bottom:10px;}
 8 |      body  {
 9 |     background-image: url("box.png");
10 |     background-color: #cccccc;
11 | }
12 | fieldset {
13 |   font-size:12px;
14 |   padding:10px;
15 |   width:250px;
16 |   line-height:1.8;}
17 | 
18 | label:hover {cursor:hand;}
19 | </style>
20 | </head>
21 | <body>
22 |  
23 | <form method="post" action="process.php">
24 | <fieldset>
25 | <legend>Room Booking:</legend>
26 | <label>First Name</label>
27 | <input type="text" name="first_name" />
28 | <br />
29 | <label>Last Name</label>
30 | <input type="text" name="last_name" />
31 | <br />
32 | <label>Room</label><br />
33 |   <select name="room">
34 |     <option value="deluxe">deluxe</option>
35 |     <option value="semi_deluxe">semi deluxe</option>
36 |     <option value="regular">regular</option>
37 |     <option value="luxury">luxury</option>
38 |   </select>
39 | <br />
40 | <label>Duration of stay</label>
41 | <input type="number" name="duration" />
42 | <br />
43 | <label>Email</label>
44 | <input type="text" name="email" />
45 |  
46 | <br />
47 | <input type="submit" value="Book Room">
48 |  </fieldset>
49 | </form>
50 |  
51 |  
52 |  
53 | </body>
54 | </html>


--------------------------------------------------------------------------------
/js/jquery.lightbox.js:
--------------------------------------------------------------------------------
  1 | //The following code is lightbox jQuery plugin
  2 | 
  3 | /**jQuery LightBox Plugin is simple, elegant, unobtrusive, 
  4 | *no need extra markup and is used to overlay images on the current page 
  5 | *through the power and flexibility of jQuery´s selector. 
  6 | *lightBox is a plugin for jQuery and it was inspired in Lightbox JS.**/
  7 | 
  8 | //code is written with reference to w3schools.com and fancybox.net
  9 | //written and created by Syed Ibrahim
 10 | 
 11 | //DO NOT MODIFY THE CODE
 12 | 
 13 | (function($) {
 14 | 	
 15 | 	$.fn.lightBox = function(settings) {
 16 | 		
 17 | 		settings = jQuery.extend({
 18 | 			
 19 | 			overlayBgColor: 		'#000',		
 20 | 			overlayOpacity:			0.8,		
 21 | 			fixedNavigation:		false,		/
 22 | 			imageLoading:			'images/lightbox-ico-loading.gif',		// (string) Path and the name of the loading icon
 23 | 			imageBtnPrev:			'images/lightbox-btn-prev.gif',			// (string) Path and the name of the prev button image
 24 | 			imageBtnNext:			'images/lightbox-btn-next.gif',			// (string) Path and the name of the next button image
 25 | 			imageBtnClose:			'images/lightbox-btn-close.gif',		// (string) Path and the name of the close btn
 26 | 			imageBlank:				'images/lightbox-blank.gif',			// (string) Path and the name of a blank image (one pixel)
 27 | 			
 28 | 			containerBorderSize:	10,			
 29 | 			containerResizeSpeed:	400,		
 30 | 			txtImage:				'Image',	
 31 | 			txtOf:					'of',		
 32 | 			keyToClose:				'c',		
 33 | 			keyToPrev:				'p',		
 34 | 			keyToNext:				'n',		
 35 | 			imageArray:				[],
 36 | 			activeImage:			0
 37 | 		},settings);
 38 | 		
 39 | 		var jQueryMatchedObj = this; 
 40 | 		function _initialize() {
 41 | 			_start(this,jQueryMatchedObj);
 42 | 			return false; 
 43 | 		}
 44 | 		
 45 | 		function _start(objClicked,jQueryMatchedObj) {
 46 | 			
 47 | 			$('embed, object, select').css({ 'visibility' : 'hidden' });
 48 | 			
 49 | 			_set_interface();
 50 | 			
 51 | 			settings.imageArray.length = 0;
 52 | 			
 53 | 			settings.activeImage = 0;
 54 | 			
 55 | 			if ( jQueryMatchedObj.length == 1 ) {
 56 | 				settings.imageArray.push(new Array(objClicked.getAttribute('href'),objClicked.getAttribute('title')));
 57 | 			} else {
 58 | 						
 59 | 				for ( var i = 0; i < jQueryMatchedObj.length; i++ ) {
 60 | 					settings.imageArray.push(new Array(jQueryMatchedObj[i].getAttribute('href'),jQueryMatchedObj[i].getAttribute('title')));
 61 | 				}
 62 | 			}
 63 | 			while ( settings.imageArray[settings.activeImage][0] != objClicked.getAttribute('href') ) {
 64 | 				settings.activeImage++;
 65 | 			}
 66 | 			
 67 | 			_set_image_to_view();
 68 | 		}
 69 | 		
 70 | 		function _set_interface() {
 71 | 			
 72 | 			$('body').append('<div id="jquery-overlay"></div><div id="jquery-lightbox"><div id="lightbox-container-image-box"><div id="lightbox-container-image"><img id="lightbox-image"><div style="" id="lightbox-nav"><a href="#" id="lightbox-nav-btnPrev"></a><a href="#" id="lightbox-nav-btnNext"></a></div><div id="lightbox-loading"><a href="#" id="lightbox-loading-link"><img src="' + settings.imageLoading + '"></a></div></div></div><div id="lightbox-container-image-data-box"><div id="lightbox-container-image-data"><div id="lightbox-image-details"><span id="lightbox-image-details-caption"></span><span id="lightbox-image-details-currentNumber"></span></div><div id="lightbox-secNav"><a href="#" id="lightbox-secNav-btnClose"><img src="' + settings.imageBtnClose + '"></a></div></div></div></div>');	
 73 | 			
 74 |            
 75 | 			var arrPageSizes = ___getPageSize();
 76 | 			
 77 |            
 78 | 			$('#jquery-overlay').css({
 79 | 				backgroundColor:	settings.overlayBgColor,
 80 | 				opacity:			settings.overlayOpacity,
 81 | 				width:				arrPageSizes[0],
 82 | 				height:				arrPageSizes[1]
 83 | 			}).fadeIn();
 84 | 			
 85 |           
 86 | 			var arrPageScroll = ___getPageScroll();
 87 | 			
 88 | 			$('#jquery-lightbox').css({
 89 | 				top:	arrPageScroll[1] + (arrPageSizes[3] / 10),
 90 | 				left:	arrPageScroll[0]
 91 | 			}).show();
 92 | 			
 93 |             
 94 | 			$('#jquery-overlay,#jquery-lightbox').click(function() {
 95 | 				_finish();									
 96 | 			});
 97 | 			
 98 | 			$('#lightbox-loading-link,#lightbox-secNav-btnClose').click(function() {
 99 | 				_finish();
100 | 				return false;
101 | 			});
102 | 			
103 |             
104 | 			$(window).resize(function() {
105 | 				
106 | 				var arrPageSizes = ___getPageSize();
107 | 				
108 |               
109 | 				$('#jquery-overlay').css({
110 | 					width:		arrPageSizes[0],
111 | 					height:		arrPageSizes[1]
112 | 				});
113 | 				
114 |                 
115 | 				var arrPageScroll = ___getPageScroll();
116 | 				
117 | 				$('#jquery-lightbox').css({
118 | 					top:	arrPageScroll[1] + (arrPageSizes[3] / 10),
119 | 					left:	arrPageScroll[0]
120 | 				});
121 | 			});
122 | 		}
123 | 		
124 | 		function _set_image_to_view() { 
125 |             
126 | 			
127 | 			$('#lightbox-loading').show();
128 | 			if ( settings.fixedNavigation ) {
129 | 				$('#lightbox-image,#lightbox-container-image-data-box,#lightbox-image-details-currentNumber').hide();
130 | 			} else {
131 | 				
132 | 				$('#lightbox-image,#lightbox-nav,#lightbox-nav-btnPrev,#lightbox-nav-btnNext,#lightbox-container-image-data-box,#lightbox-image-details-currentNumber').hide();
133 | 			}
134 | 			
135 | 			var objImagePreloader = new Image();
136 | 			objImagePreloader.onload = function() {
137 | 				$('#lightbox-image').attr('src',settings.imageArray[settings.activeImage][0]);
138 | 				
139 | 				_resize_container_image_box(objImagePreloader.width,objImagePreloader.height);
140 | 				
141 | 				objImagePreloader.onload=function(){};
142 | 			};
143 | 			objImagePreloader.src = settings.imageArray[settings.activeImage][0];
144 | 		};
145 | 		
146 | 		function _resize_container_image_box(intImageWidth,intImageHeight) {
147 | 			
148 | 			var intCurrentWidth = $('#lightbox-container-image-box').width();
149 | 			var intCurrentHeight = $('#lightbox-container-image-box').height();
150 | 			
151 | 			var intWidth = (intImageWidth + (settings.containerBorderSize * 2)); 
152 | 			var intHeight = (intImageHeight + (settings.containerBorderSize * 2)); value
153 | 		
154 | 			var intDiffW = intCurrentWidth - intWidth;
155 | 			var intDiffH = intCurrentHeight - intHeight;
156 | 			
157 | 			$('#lightbox-container-image-box').animate({ width: intWidth, height: intHeight },settings.containerResizeSpeed,function() { _show_image(); });
158 | 			if ( ( intDiffW == 0 ) && ( intDiffH == 0 ) ) {
159 | 				if ( $.browser.msie ) {
160 | 					___pause(250);
161 | 				} else {
162 | 					___pause(100);	
163 | 				}
164 | 			} 
165 | 			$('#lightbox-container-image-data-box').css({ width: intImageWidth });
166 | 			$('#lightbox-nav-btnPrev,#lightbox-nav-btnNext').css({ height: intImageHeight + (settings.containerBorderSize * 2) });
167 | 		};
168 | 		
169 | 		function _show_image() {
170 | 			$('#lightbox-loading').hide();
171 | 			$('#lightbox-image').fadeIn(function() {
172 | 				_show_image_data();
173 | 				_set_navigation();
174 | 			});
175 | 			_preload_neighbor_images();
176 | 		};
177 | 		
178 | 		function _show_image_data() {
179 | 			$('#lightbox-container-image-data-box').slideDown('fast');
180 | 			$('#lightbox-image-details-caption').hide();
181 | 			if ( settings.imageArray[settings.activeImage][1] ) {
182 | 				$('#lightbox-image-details-caption').html(settings.imageArray[settings.activeImage][1]).show();
183 | 			}
184 | 			
185 | 			if ( settings.imageArray.length > 1 ) {
186 | 				$('#lightbox-image-details-currentNumber').html(settings.txtImage + ' ' + ( settings.activeImage + 1 ) + ' ' + settings.txtOf + ' ' + settings.imageArray.length).show();
187 | 			}		
188 | 		}
189 | 	
190 | 		function _set_navigation() {
191 | 			$('#lightbox-nav').show();
192 | 
193 | 		
194 | 			$('#lightbox-nav-btnPrev,#lightbox-nav-btnNext').css({ 'background' : 'transparent url(' + settings.imageBlank + ') no-repeat' });
195 | 			
196 | 			
197 | 			if ( settings.activeImage != 0 ) {
198 | 				if ( settings.fixedNavigation ) {
199 | 					$('#lightbox-nav-btnPrev').css({ 'background' : 'url(' + settings.imageBtnPrev + ') left 15% no-repeat' })
200 | 						.unbind()
201 | 						.bind('click',function() {
202 | 							settings.activeImage = settings.activeImage - 1;
203 | 							_set_image_to_view();
204 | 							return false;
205 | 						});
206 | 				} else {
207 | 					// Show the images button for Next buttons
208 | 					$('#lightbox-nav-btnPrev').unbind().hover(function() {
209 | 						$(this).css({ 'background' : 'url(' + settings.imageBtnPrev + ') left 15% no-repeat' });
210 | 					},function() {
211 | 						$(this).css({ 'background' : 'transparent url(' + settings.imageBlank + ') no-repeat' });
212 | 					}).show().bind('click',function() {
213 | 						settings.activeImage = settings.activeImage - 1;
214 | 						_set_image_to_view();
215 | 						return false;
216 | 					});
217 | 				}
218 | 			}
219 | 			
220 | 			
221 | 			if ( settings.activeImage != ( settings.imageArray.length -1 ) ) {
222 | 				if ( settings.fixedNavigation ) {
223 | 					$('#lightbox-nav-btnNext').css({ 'background' : 'url(' + settings.imageBtnNext + ') right 15% no-repeat' })
224 | 						.unbind()
225 | 						.bind('click',function() {
226 | 							settings.activeImage = settings.activeImage + 1;
227 | 							_set_image_to_view();
228 | 							return false;
229 | 						});
230 | 				} else {
231 | 					
232 | 					$('#lightbox-nav-btnNext').unbind().hover(function() {
233 | 						$(this).css({ 'background' : 'url(' + settings.imageBtnNext + ') right 15% no-repeat' });
234 | 					},function() {
235 | 						$(this).css({ 'background' : 'transparent url(' + settings.imageBlank + ') no-repeat' });
236 | 					}).show().bind('click',function() {
237 | 						settings.activeImage = settings.activeImage + 1;
238 | 						_set_image_to_view();
239 | 						return false;
240 | 					});
241 | 				}
242 | 			}
243 | 			
244 | 			_enable_keyboard_navigation();
245 | 		}
246 | 		
247 | 		function _enable_keyboard_navigation() {
248 | 			$(document).keydown(function(objEvent) {
249 | 				_keyboard_action(objEvent);
250 | 			});
251 | 		}
252 | 		
253 | 		function _disable_keyboard_navigation() {
254 | 			$(document).unbind();
255 | 		}
256 | 		
257 | 		function _keyboard_action(objEvent) {
258 | 			
259 | 			if ( objEvent == null ) {
260 | 				keycode = event.keyCode;
261 | 				escapeKey = 27;
262 | 			
263 | 			} else {
264 | 				keycode = objEvent.keyCode;
265 | 				escapeKey = objEvent.DOM_VK_ESCAPE;
266 | 			}
267 | 			
268 | 			key = String.fromCharCode(keycode).toLowerCase();
269 | 			
270 | 			if ( ( key == settings.keyToClose ) || ( key == 'x' ) || ( keycode == escapeKey ) ) {
271 | 				_finish();
272 | 			}
273 | 			
274 | 			if ( ( key == settings.keyToPrev ) || ( keycode == 37 ) ) {
275 | 				
276 | 				if ( settings.activeImage != 0 ) {
277 | 					settings.activeImage = settings.activeImage - 1;
278 | 					_set_image_to_view();
279 | 					_disable_keyboard_navigation();
280 | 				}
281 | 			}
282 | 		
283 | 			if ( ( key == settings.keyToNext ) || ( keycode == 39 ) ) {
284 | 				
285 | 				if ( settings.activeImage != ( settings.imageArray.length - 1 ) ) {
286 | 					settings.activeImage = settings.activeImage + 1;
287 | 					_set_image_to_view();
288 | 					_disable_keyboard_navigation();
289 | 				}
290 | 			}
291 | 		}
292 | 		
293 | 		function _preload_neighbor_images() {
294 | 			if ( (settings.imageArray.length -1) > settings.activeImage ) {
295 | 				objNext = new Image();
296 | 				objNext.src = settings.imageArray[settings.activeImage + 1][0];
297 | 			}
298 | 			if ( settings.activeImage > 0 ) {
299 | 				objPrev = new Image();
300 | 				objPrev.src = settings.imageArray[settings.activeImage -1][0];
301 | 			}
302 | 		}
303 | 		
304 | 		function _finish() {
305 | 			$('#jquery-lightbox').remove();
306 | 			$('#jquery-overlay').fadeOut(function() { $('#jquery-overlay').remove(); });
307 | 			// Show some elements to avoid conflict with overlay in IE. These elements appear above the overlay.
308 | 			$('embed, object, select').css({ 'visibility' : 'visible' });
309 | 		}
310 | 		
311 | 		function ___getPageSize() {
312 | 			var xScroll, yScroll;
313 | 			if (window.innerHeight && window.scrollMaxY) {	
314 | 				xScroll = window.innerWidth + window.scrollMaxX;
315 | 				yScroll = window.innerHeight + window.scrollMaxY;
316 | 			} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
317 | 				xScroll = document.body.scrollWidth;
318 | 				yScroll = document.body.scrollHeight;
319 | 			} else { 
320 | 				xScroll = document.body.offsetWidth;
321 | 				yScroll = document.body.offsetHeight;
322 | 			}
323 | 			var windowWidth, windowHeight;
324 | 			if (self.innerHeight) {	// all except Explorer
325 | 				if(document.documentElement.clientWidth){
326 | 					windowWidth = document.documentElement.clientWidth; 
327 | 				} else {
328 | 					windowWidth = self.innerWidth;
329 | 				}
330 | 				windowHeight = self.innerHeight;
331 | 			} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
332 | 				windowWidth = document.documentElement.clientWidth;
333 | 				windowHeight = document.documentElement.clientHeight;
334 | 			} else if (document.body) { // other Explorers
335 | 				windowWidth = document.body.clientWidth;
336 | 				windowHeight = document.body.clientHeight;
337 | 			}	
338 | 			
339 | 			if(yScroll < windowHeight){
340 | 				pageHeight = windowHeight;
341 | 			} else { 
342 | 				pageHeight = yScroll;
343 | 			}
344 | 		
345 | 			if(xScroll < windowWidth){	
346 | 				pageWidth = xScroll;		
347 | 			} else {
348 | 				pageWidth = windowWidth;
349 | 			}
350 | 			arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight);
351 | 			return arrayPageSize;
352 | 		};
353 | 		
354 | 		function ___getPageScroll() {
355 | 			var xScroll, yScroll;
356 | 			if (self.pageYOffset) {
357 | 				yScroll = self.pageYOffset;
358 | 				xScroll = self.pageXOffset;
359 | 			} else if (document.documentElement && document.documentElement.scrollTop) {	 // Explorer 6 Strict
360 | 				yScroll = document.documentElement.scrollTop;
361 | 				xScroll = document.documentElement.scrollLeft;
362 | 			} else if (document.body) {// all other Explorers
363 | 				yScroll = document.body.scrollTop;
364 | 				xScroll = document.body.scrollLeft;	
365 | 			}
366 | 			arrayPageScroll = new Array(xScroll,yScroll);
367 | 			return arrayPageScroll;
368 | 		};
369 | 		
370 | 		 function ___pause(ms) {
371 | 			var date = new Date(); 
372 | 			curDate = null;
373 | 			do { var curDate = new Date(); }
374 | 			while ( curDate - date < ms);
375 | 		 };
376 | 		
377 | 		return this.unbind('click').click(_initialize);
378 | 	};
379 | })(jQuery); 


--------------------------------------------------------------------------------
/js/responsiveslides.min.js:
--------------------------------------------------------------------------------
1 | //This plugin is used create responsive slides
2 | /*! http://responsiveslides.com v1.53 by @viljamis */
3 | (function(c,I,B){c.fn.responsiveSlides=function(l){var a=c.extend({auto:!0,speed:500,timeout:4E3,pager:!1,nav:!1,random:!1,pause:!1,pauseControls:!0,prevText:"Previous",nextText:"Next",maxwidth:"",navContainer:"",manualControls:"",namespace:"rslides",before:c.noop,after:c.noop},l);return this.each(function(){B++;var f=c(this),s,r,t,m,p,q,n=0,e=f.children(),C=e.size(),h=parseFloat(a.speed),D=parseFloat(a.timeout),u=parseFloat(a.maxwidth),g=a.namespace,d=g+B,E=g+"_nav "+d+"_nav",v=g+"_here",j=d+"_on",
4 | w=d+"_s",k=c("<ul class='"+g+"_tabs "+d+"_tabs' />"),x={"float":"left",position:"relative",opacity:1,zIndex:2},y={"float":"none",position:"absolute",opacity:0,zIndex:1},F=function(){var b=(document.body||document.documentElement).style,a="transition";if("string"===typeof b[a])return!0;s=["Moz","Webkit","Khtml","O","ms"];var a=a.charAt(0).toUpperCase()+a.substr(1),c;for(c=0;c<s.length;c++)if("string"===typeof b[s[c]+a])return!0;return!1}(),z=function(b){a.before();F?(e.removeClass(j).css(y).eq(b).addClass(j).css(x),
5 | n=b,setTimeout(function(){a.after()},h)):e.stop().fadeOut(h,function(){c(this).removeClass(j).css(y).css("opacity",1)}).eq(b).fadeIn(h,function(){c(this).addClass(j).css(x);a.after();n=b})};a.random&&(e.sort(function(){return Math.round(Math.random())-0.5}),f.empty().append(e));e.each(function(a){this.id=w+a});f.addClass(g+" "+d);l&&l.maxwidth&&f.css("max-width",u);e.hide().css(y).eq(0).addClass(j).css(x).show();F&&e.show().css({"-webkit-transition":"opacity "+h+"ms ease-in-out","-moz-transition":"opacity "+
6 | h+"ms ease-in-out","-o-transition":"opacity "+h+"ms ease-in-out",transition:"opacity "+h+"ms ease-in-out"});if(1<e.size()){if(D<h+100)return;if(a.pager&&!a.manualControls){var A=[];e.each(function(a){a+=1;A+="<li><a href='#' class='"+w+a+"'>"+a+"</a></li>"});k.append(A);l.navContainer?c(a.navContainer).append(k):f.after(k)}a.manualControls&&(k=c(a.manualControls),k.addClass(g+"_tabs "+d+"_tabs"));(a.pager||a.manualControls)&&k.find("li").each(function(a){c(this).addClass(w+(a+1))});if(a.pager||a.manualControls)q=
7 | k.find("a"),r=function(a){q.closest("li").removeClass(v).eq(a).addClass(v)};a.auto&&(t=function(){p=setInterval(function(){e.stop(!0,!0);var b=n+1<C?n+1:0;(a.pager||a.manualControls)&&r(b);z(b)},D)},t());m=function(){a.auto&&(clearInterval(p),t())};a.pause&&f.hover(function(){clearInterval(p)},function(){m()});if(a.pager||a.manualControls)q.bind("click",function(b){b.preventDefault();a.pauseControls||m();b=q.index(this);n===b||c("."+j).queue("fx").length||(r(b),z(b))}).eq(0).closest("li").addClass(v),
8 | a.pauseControls&&q.hover(function(){clearInterval(p)},function(){m()});if(a.nav){g="<a href='#' class='"+E+" prev'>"+a.prevText+"</a><a href='#' class='"+E+" next'>"+a.nextText+"</a>";l.navContainer?c(a.navContainer).append(g):f.after(g);var d=c("."+d+"_nav"),G=d.filter(".prev");d.bind("click",function(b){b.preventDefault();b=c("."+j);if(!b.queue("fx").length){var d=e.index(b);b=d-1;d=d+1<C?n+1:0;z(c(this)[0]===G[0]?b:d);if(a.pager||a.manualControls)r(c(this)[0]===G[0]?b:d);a.pauseControls||m()}});
9 | a.pauseControls&&d.hover(function(){clearInterval(p)},function(){m()})}}if("undefined"===typeof document.body.style.maxWidth&&l.maxwidth){var H=function(){f.css("width","100%");f.width()>u&&f.css("width",u)};H();c(I).bind("resize",function(){H()})}})}})(jQuery,this,0);


--------------------------------------------------------------------------------
/process.php:
--------------------------------------------------------------------------------
 1 | <?php include 'database.php'; ?>
 2 | 
 3 | <?php
 4 | 
 5 | // create a variable
 6 | $first_name=$_POST['first_name'];
 7 | $last_name=$_POST['last_name'];
 8 | $room=$_POST['room'];
 9 | $duration=$_POST['duration'];
10 | $email=$_POST['email'];
11 | 
12 | //Execute the query
13 | 
14 | 
15 | mysqli_query($connect,"INSERT INTO employees1 (first_name,last_name,room,duration,email)
16 | 		        VALUES ('$first_name','$last_name','$room','$duration','$email')");
17 | 				
18 | 	if(mysqli_affected_rows($connect) > 0){
19 | 		echo"<h1> Thank You!!!</h1>";
20 | 		echo "$last_name";
21 | 	echo "<p>Your room is booked</p>";
22 |         echo"<br><br>You are being redirected to home page.....";
23 | 	echo '<a href="index.html">Click here</a>';
24 | } else {
25 | 	echo "your room is not booked<br />";
26 | 	echo mysqli_error ($connect);
27 | }


--------------------------------------------------------------------------------
/services.html:
--------------------------------------------------------------------------------
  1 | <!--
  2 | Author: Syed Ibrahim
  3 | Author URL: http://zeeshanovic.blogspot.com
  4 | -->
  5 | <!DOCTYPE HTML>
  6 | <html>
  7 | 	<head>
  8 | 		<title>Hotel Website | Services</title>
  9 | 		<link href="css/style.css" rel="stylesheet" type="text/css"  media="all" />
 10 | 		<link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow' rel='stylesheet' type='text/css'>
 11 | 	</head>
 12 | 	<body>
 13 | 		<!---start-Wrap--->
 14 | 			<!---start-header--->
 15 | 			<div class="header">
 16 | 				<div class="wrap">
 17 | 					<div class="header-top">
 18 | 						<div class="logo">
 19 | 							<a href="index.html"><img src="images/logo2.png" title="logo" /></a>
 20 | 						</div>
 21 |                         <img src="images/marriott_logo.jpg" align="center" width=700px height=150 px>
 22 | 						<div class="contact-info">
 23 | 							<a href = "contact.html" target = "_self"> 
 24 | 								<img src = "/images/contact-us.png" alt = "contact-us" width=300px height=50px border = "0"/> 
 25 | 							<p class="phone">Call us : <a href="#">98xxxxxxxx</a></p>
 26 | 							<p class="gps">Gps : <a href="#top123">View map</a></p>
 27 | 							<p class="code">BROUGHT TO YOU BY:<a href="https:zeeshanovic.blogspot.com">Syed Ibrahim</a></p>
 28 | 						</div>
 29 | 						<div class="clear"> </div>
 30 | 					</div>
 31 | 				</div>
 32 | 				<div class="header-top-nav">
 33 | 					<div class="wrap">
 34 | 						<ul>
 35 | 							<li><a href="index.html">Home</a></li>
 36 | 							<li><a href="about.html">About</a></li>
 37 | 							<li class="active"><a href="services.html">Services</a></li>
 38 | 							<li><a href="gallery.html">Gallery</a></li>
 39 | 							<div class="clear"> </div>
 40 | 						</ul>
 41 | 					</div>
 42 | 				</div>
 43 | 			</div>
 44 | 			<!---End-header--->
 45 | 			<div class="clear"> </div>
 46 | 			<!---start-content----->
 47 | 			<div class="content">
 48 | 				<div class="wrap">
 49 | 					<!-----start--services------>
 50 | 					<div class="services">
 51 | 						<div class="service-content">
 52 | 							<h3>Our Hotel Services</h3>
 53 | 							<ul>
 54 | 								<li><span>1.</span></li>
 55 | 								<li><p><a href="#">CULTURE SHOW</a> We have one of the most sophisticated shows. Come join us....</p></li>
 56 | 								<div class="clear"> </div>
 57 | 							</ul>
 58 | 							<ul>
 59 | 								<li><span>2.</span></li>
 60 | 								<li><p><a href="#">SWIMMING POOL</a> You can enjoy Swimming in the pool and relax with a drink. . .. . .  </p></li>
 61 | 								<div class="clear"> </div>
 62 | 							</ul>
 63 | 							<ul>
 64 | 								<li><span>3.</span></li>
 65 | 								<li><p><a href="#">RESTAURANT</a> You can have a booze or order at swiggy all at one place.... </p></li>
 66 | 								<div class="clear"> </div>
 67 | 							</ul>
 68 | 							<ul>
 69 | 								<li><span>4.</span></li>
 70 | 								<li><p><a href="#">CONFERENCE HALL</a>Here You can do your buisness and relax, all at one go. . . .</p></li>
 71 | 								<div class="clear"> </div>
 72 | 							</ul>
 73 | 							<ul>
 74 | 								<li><span>5.</span></li>
 75 | 								<li><p><a href="#">SPA</a>Here you are for surprises. . . .</p></li>
 76 | 								<div class="clear"> </div>
 77 | 							</ul>
 78 | 							<ul>
 79 | 								<li><span>6.</span></li>
 80 | 								<li><p><a href="#">POOLSIDE BAR</a> To chill, booze and fun. . .. . </p></li>
 81 | 								<div class="clear"> </div>
 82 | 							</ul>
 83 | 						</div>
 84 | 						<div class="services-sidebar">
 85 | 							<h3>WE PROVIDE</h3>
 86 | 							 <ul>
 87 | 							  	<li><a href="https:www.swiggy.com">Swiggy</a></li>
 88 | 							  	<li><a href="https:www.trivago.com">Trivago</a></li>
 89 | 							  	<li><a href="https:www.foodpanda.com">foodpanda</a></li>
 90 | 							  	<li><a href="https:www.bookmytrip.com">book my trip</a></li>
 91 | 							  	<li><a href="https:www.zomato.com">zomato</a></li>
 92 | 								
 93 | 								
 94 | 	                            
 95 | 							  	<li><a href="#">other facility</a></li>
 96 | 					 		 </ul>
 97 | 					 		 
 98 | 						</div>
 99 | 						<div class="clear"> </div>
100 | 					</div>
101 | 					<!-----End--services------>
102 | 				</div>
103 | 				<div class="clear"> </div>
104 | 				<div class="boxs">
105 | 				<div class="wrap">
106 | 				<div class="box">
107 | 					 
108 | 				</div>
109 | 				<div class="box center-box">
110 | 					<ul>
111 | 					<li><a href="#" onclick="myFunction()">Leave a Feedback</a></li>
112 | 						<li><a href="#" onclick="myFunction1()">Reviews and Ratings</a></li>
113 | 						<li><a href="gallery.html">gallery</a></li>
114 | 						<li><a href="services.html">Services</a></li>
115 | 						<li><a href="https:www.quora.com/What-is-trekking">Know about Moutaineering and trekking here</a></li>
116 | 						<li><a href="https:zeeshanovic.blogspot.com">zeeshanovic.blogspot.com</a></li>
117 | 					</ul>
118 | 				</div>
119 |                      <div id="top123"> 
120 |                           <img src="images/map Manila Marriott Hotel.JPG" height=200px width=450px height=125px width=450px align= rights>
121 |                     </div>
122 | 				<div class="box">
123 | 					
124 | 				</div>
125 | 				<div class="clear"> </div>
126 | 			</div>
127 | 			<!---start-box---->
128 | 		</div>
129 | 		<!---start-copy-Right----->
130 | 		<div class="copy-tight">
131 | 			<p>&copy HOTEL Awesome,Demo Land 2018</p>
132 | 		</div>
133 | 		<!---End-copy-Right----->
134 | 			</div>
135 | 			<!---End-content----->
136 | 		</div>
137 | 		<!---End-Wrap--->
138 | 	</body>
139 | </html>
140 | 
141 | 


--------------------------------------------------------------------------------