forked from Jimlah/hngi7Hotel4
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathrooms_rates.html
205 lines (183 loc) · 11.7 KB
/
rooms_rates.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Rooms and Services</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<link rel="stylesheet" href="room.css">
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400;1,600&display=swap" rel="stylesheet">
<!-- font awesome cdn -->
<script src="https://kit.fontawesome.com/7d4482d100.js" crossorigin="anonymous"></script>
</head>
<body>
<nav style="padding-bottom: 0;" class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container">
<a class="navbar-brand" href="#">
<div class="square" style="width: 80px; height: 70px; background-color: #002c5c; position: absolute; margin-top: -20px; text-align: center; font-size: 15px; color: white; font-family:'Open Sans', sans-serif; font-weight: 600; font-style: italic;"><p style="margin-top: 10px;"> Derine <br> Salanza</p></div>
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse text-center" id="navbarNav">
<ul class=" navbar-nav navbar-left ml-auto">
<li class="nav-item px-lg-3">
<a class="nav-link " href="index.html">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item active px-lg-3">
<a class="nav-link" href="rooms_rates.html">Room and Rates</a>
</li>
<li class="nav-item px-lg-3">
<a class="nav-link" href="facilities.html">Facilities</a>
</li>
<li class="nav-item px-lg-3">
<a class="nav-link" href="contact.html">Contact Us</a>
</li>
</ul>
</div>
</div>
</nav>
<section class="section-one container mt-5">
<h2>Explore our luxury rooms</h2>
<p>
We offer a superb collection of rooms and suites, each offering individual character and charm.
<br> <br>
Maecenas tempus justo nec eros congue congue. In eu leo vestibulum, aliquet turpis eu, vestibulum leo.
Integer sagittis, augue in pretium finibus, arcu velit pulvinar tellus, et posuere ligula arcu eu purus.
Suspendisse pharetra nunc at finibus convallis. Sed interdum sit amet diam sit amet pretium. Nam molestie vitae ipsum a blandit.
</p>
</section>
<br><br><br>
<section class="section-one container blue px-0">
<div class="row">
<div class="col col-12 col-lg-5 ml-lg-0 px-5 president text-light float-left mx-auto mb-3 mb-lg-0">
<div class="mt-5"> <h3>STANDARD SUITES</h3>
<p>Eco-friendly amenities and a variety of other touches welcome guests in the Deluxe Suites.</p>
<div class="btn-group ml-5 ml-lg-0" role="group" aria-label="Basic example">
<button type="button" class="btn btn-primary">31 <br><span style="font-size: 12px;">SIZE</span> <br>M₂</button>
<button type="button" class="btn btn-primary">2 <br><span style="font-size: 12px;">MAX</span><br> Adults</button>
<button type="button" class="btn btn-primary">0 <br><span style="font-size: 12px;">MAX</span><br>Children</button> </div>
<p class="mt-3" style="position: absolute;">From</p>
<p class="mt-5" style="font-size: 25px;font-weight: bold;">₦45,000</p>
<a href="#" class="btn btn-light ">BOOK NOW</a>
</div>
</div>
<div class="col col-12 col-lg-7 ">
<div class="ml-0 ml-lg-5 px-0"> <img src="images/first-img.png" class=" img-fluid float-lg-right px-0" alt="Deluxe Suites" width="100%" height="400px" style="max-width: 100%;"></div>
</div>
</div>
</section>
<br>
<section class="section-five container blue px-0">
<div class="row">
<div class="col col-12 col-lg-6">
<div> <img src="images/second-img.png" class="img-fluid float-left px-0 presidentIMG" alt="Double Standard Suite" width="100%" height="400px" style="max-width: 100%;"></div>
</div>
<div class="col col-12 col-lg-5 ml-lg-0 px-5 president text-light mx-auto mb-3 mb-lg-0">
<div class="mt-5"> <h3>DOUBLE STANDARD SUITE</h3>
<p>Eco-friendly amenities and a variety of other touches welcome guests in the Deluxe Suites.</p>
<div class="btn-group ml-5 ml-lg-0" role="group" aria-label="Basic example">
<button type="button" class="btn btn-primary">31 <br><span style="font-size: 12px;">SIZE</span> <br>M₂</button>
<button type="button" class="btn btn-primary">2 <br><span style="font-size: 12px;">MAX</span><br> Adults</button>
<button type="button" class="btn btn-primary">0 <br><span style="font-size: 12px;">MAX</span><br>Children</button> </div>
<p class="mt-3" style="position: absolute;">From</p>
<p class="mt-5" style="font-size: 25px;font-weight: bold;">₦65,000</p>
<a href="#" class="btn btn-light ">BOOK NOW</a>
</div>
</div>
</div>
</section>
<br>
<section class="section-one container blue px-0">
<div class="row">
<div class="col col-12 col-lg-5 ml-lg-0 px-5 president text-light float-left mx-auto mb-3 mb-lg-0">
<div class="mt-5"> <h3 class="">DELUXE SUITE</h3>
<p>Eco-friendly amenities and a variety of other touches welcome guests in the Deluxe Suites.</p>
<div class="btn-group ml-5 ml-lg-0" role="group" aria-label="Basic example">
<button type="button" class="btn btn-primary">31 <br><span style="font-size: 12px;">SIZE</span> <br>M₂</button>
<button type="button" class="btn btn-primary">2 <br><span style="font-size: 12px;">MAX</span><br> Adults</button>
<button type="button" class="btn btn-primary">0 <br><span style="font-size: 12px;">MAX</span><br>Children</button> </div>
<p class="mt-3" style="position: absolute;">From</p>
<p class="mt-5" style="font-size: 25px;font-weight: bold;">₦75,000</p>
<a href="#" class="btn btn-light ">BOOK NOW</a>
</div>
</div>
<div class="col col-12 col-lg-7 ">
<div class="ml-0 ml-lg-5 px-0"> <img src="images/third-img.png" class=" img-fluid float-right px-0" alt="Deluxe Suites" width="100%" height="400px" style="max-width: 100%;"></div>
</div>
</div>
</section>
<br>
<section class="section-five container blue px-0">
<div class="row">
<div class="col col-12 col-lg-6">
<div> <img src="images/fourth-img.png" class="img-fluid float-left px-0 presidentIMG" alt="Presidential Suites" width="100%" height="400px" style="max-width: 100%;"></div>
</div>
<div class="col col-12 col-lg-5 ml-lg-0 px-5 president text-light mx-auto mb-3 mb-lg-0">
<div class="mt-5"> <h3> PRESIDENTIAL SUITES</h3>
<p>Eco-friendly amenities and a variety of other touches welcome guests in the Deluxe Suites.</p>
<div class="btn-group ml-5 ml-lg-0 " role="group" aria-label="Basic example">
<button type="button" class="btn btn-primary">31 <br><span style="font-size: 12px;">SIZE</span> <br>M₂</button>
<button type="button" class="btn btn-primary">2 <br><span style="font-size: 12px;">MAX</span><br> Adults</button>
<button type="button" class="btn btn-primary">0 <br><span style="font-size: 12px;">MAX</span><br>Children</button> </div>
<p class="mt-3" style="position: absolute;">From</p>
<p class="mt-5" style="font-size: 25px;font-weight: bold;">₦150,000</p>
<a href="#" class="btn btn-light ">BOOK NOW</a>
</div>
</div>
</div>
</section>
<br>
<footer class="page-footer font-small" style="background-color: #002c5c;">
<div class="container text-center text-md-left mt text-white" style="padding-top: 50px;">
<div class="row">
<div class="col-md-3">
<h6 class="text-uppercase font-weight-bold">OUR ADDRESS</h6>
<p>Derine Salanza <br /> Motila Drive, Lagos, Nigeria.</p>
</div>
<div class="col-md-3 col-lg-3 col-xl-3 mx-auto mb-3">
<h6 class="text-uppercase font-weight-bold">RESERVATION</h6>
<p>Telephone: (+234) 222-333-5851 <br />
Email: [email protected]</p>
</div>
<div class="col-md-6 col-lg-4 col-xl-4 mx-auto mb-md-0 mb-5">
<h6 class="text-uppercase font-weight-bold">SUBSCRIBE TO OUR NEWS LETTER</h6>
<div class="input-group mb-3">
<input type="text" class="form-control" placeholder="Email Address..."
aria-label="Email Address" aria-describedby="basic-addon2"
style="color: #ffffff; background-color: #002c5c;">
<div class="input-group-append">
<span class="input-group-text text-white" id="basic-addon2"
style="background: #00c851;"><b>Submit</b></span>
</div>
</div>
</div>
</div>
</div>
<div style="background-color: #002c5c;">
<div class="container">
<div class="row py-4 d-flex align-items-center text-white">
<div class="col-md-6 col-lg-5 text-center text-md-left mb-4 mb-md-0">
<p class="mb-0">
© 2020 Derine Salanza Hotel
<a href="#" style="color: white;">Terms</a>
<a href="#" style="color: white;">Privacy</a>
<a href="#" style="color: white;"><b>English</b></a>
</p>
</div>
<div class="col-md-6 col-lg-7 text-center text-md-right">
<a class="fb-ic"> <i class="fab fa-facebook-f white-text mr-1"> </i> </a>
<a class="tw-ic"> <i class="fab fa-twitter white-text mr-1"> </i> </a>
<a class="li-ic"> <i class="fab fa-linkedin-in white-text mr-1"> </i> </a>
<a class="pinterest-ic"> <i class="fab fa-pinterest white-text mr-1"> </i> </a>
<a class="ins-ic"> <i class="fab fa-instagram white-text mr-5"> </i> </a>
</div>
</div>
</div>
</div>
</footer>
</body>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
</html>