-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
199 lines (170 loc) · 12.4 KB
/
index.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
<!doctype html>
<html lang="en">
<head>
<title>HOLO</title>
<!-- Required meta tags -->
<meta name="description" content="Holo is a travel company which provides online travel services including flight tickets, domestic and international holiday packages, hotel reservations, rail and bus tickets, etc.">
<meta charset="utf-8">
<meta https-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Encode+Sans+Expanded" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Montserrat:900|Oswald|Varela+Round" rel="stylesheet">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="style.css">
<!-- Latest compiled and minified JavaScript -->
<link rel="icon" href="logo1.jpg" />
<script defer src="https://use.fontawesome.com/releases/v5.0.8/js/all.js"></script>
</head>
<body>
<div class="navbar navbar-default navbar-collapse-top" data-spy="affix" data-offset-top="197" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html"><span><img style="padding-bottom: 10px;border-radius: 10px;" src="./images/logo3.jpg" ></span><span style="font-family: 'Montserrat', sans-serif;color: #7BC4FB;"> HOLO</span> </a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right" >
<li class="active"><a href="index.html" style="font-weight: bold;font-family: 'Raleway', sans-serif;">Home</a></li>
<li ><a href="blog.html" style="font-weight: bold;font-family: 'Raleway', sans-serif;">Blog</a></li>
<li ><a href="contact.html" style="font-weight: bold;font-family: 'Raleway', sans-serif;">Contact</a></li>
</ul>
</div>
</div>
</div>
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
<li data-target="#myCarousel" data-slide-to="3"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item active">
<img src="./images/pic3.jpg" style="width:100%;height: 100%;">
<div class="carousel-content" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif; ">
<center>To Travel is to Live!
<br><span class="fonts" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif; ">Plan your holidays with us and make your trip hasslefree!<span> </center></div>
</div>
<div class="item">
<img src="./images/pic11.jpeg" style="width:100%; object-fit: cover; background-size: 100% 100%;height: 100%"">
<div class="carousel-content" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif;">
<center> Go abroad !
<br><span class="fonts" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif; ">Get exciting packages on foreign trips <span> </center></div>
</div>
<div class="item">
<img src="./images/pic2.jpg" style="width:100%; object-fit: cover; background-size: 100% 100%;background-size: contain;background-position: center;height: 100%">
<div class="carousel-content" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif;">
<center> Worry about planning trips?
<br><span class="fonts" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif; ">Leave it to us!<span> </center></div>
</div>
<div class="item">
<img src="./images/wander.jpg" style="width:100%; object-fit: cover;background-size: 100%;height: 100%"">
<div class="carousel-content" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif;">
<center> Are you a wanderlust?
<br><span class="fonts" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif; "> Then you are on the right spot!<span> </center></div>
</div>
</div>
<!-- Left and right controls -->
<a class="left carousel-control" href="#myCarousel" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
<span class="sr-only">Next</span>
</a>
</div>
<br><br>
<div class="container">
<p class="heading" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif; color:#3D749D;"> What do we do?</p>
<p class="font2" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif; "> Holo is a travel company which provides online travel services including flight tickets, domestic and international holiday packages, hotel reservations, rail and bus tickets, etc. We care for your travel plans so that you can spend your holidays hasslefree! </p>
<p class="heading" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif; color:#3D749D;"> Read our blog</p>
<p class="font2" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif; "> Holo provides a descriptive blog on travel! We are open to wanderlust who would love to share experiences of places and trips. We have an exclusive team who writes and maintains the blog for our users. </p>
<a class="heading1" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif; " href="blog.html">Hang out in Barcelona! <sup style="color: red;font-size: 10px;font-weight: bold">NEW</sup></a>
<div class="row">
<br>
<div class="col-sm-3">
<img src="./images/barca1.jpeg">
</div>
<div class="col-sm-9">
<p class="font2" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif; " > Until a few days before we left and I didn’t reveal our location until we reached the security gate at the airport. I was so pleased with myself for managing to keep it a secret! I wanted the trip to be extra special . Barcelona is a city that goes 24 hours a day, 7 days a week and could give NYC a run for the “city that never sleeps” title. Be prepared for late-night dinners and parties til dawn. Barcelona knows how to get down. Besides a great food and nightlife scene, there is a wonderful beach, Gaudi architecture, and history dating back to Roman times. <a style="text-decoration: none" href="blog.html">read more ....</a></p>
</div>
</div>
<br>
<p class="font2" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif; color: red" > Abroad Holiday packages are coming soon! :</p>
<br>
<ul class="font2" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif; ">
<li> USA - 5 nights and 6 days- NewYork,CA, Pittsburg</li>
<li> Britain- 4 nights and 5 days- London, York, Manchester</li>
<li> Australia- 6 nights and 7 days- Sydney, Melbourne, Great Barrier Reef </li>
</ul>
<br><br>
<div class="row">
<div class="col-sm-4">
<center style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif; font-size: 25px;color: #222FE4">Maldives<br>
<img src="./images/mal.jpeg">
<div class="overlay">
<div class="text">Link coming soon!</div>
</div>
<p class="font2" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif;color: grey ; ">Lorem ipsum dolor sit amet, tempor prodesset eos no. Temporibus necessitatibus sea ei, at tantas oporteat nam. Lorem ipsum dolor sit amet, tempor prodesset eos no.</p></center>
</div>
<div class="col-sm-4">
<center style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif; font-size: 25px;color: #F73227">India<br>
<img src="./images/india1.jpg">
<div class="overlay">
<div class="text">Link coming soon!</div>
</div>
<p class="font2" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif; color: grey;">Lorem ipsum dolor sit amet, tempor prodesset eos no. Temporibus necessitatibus sea ei, at tantas oporteat nam. Lorem ipsum dolor sit amet, tempor prodesset eos no.</p></center>
</div>
<div class="col-sm-4">
<center style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif; font-size: 25px;color: #D032B6"> Switzerland<br>
<img src="./images/swiss1.jpeg">
<div class="overlay">
<div class="text">Link coming soon!</div>
</div>
<p class="font2" style="font-style:font-weight: bold;font-family: 'Raleway', sans-serif; color: grey;">Lorem ipsum dolor sit amet, tempor prodesset eos no. Temporibus necessitatibus sea ei, at tantas oporteat nam. Lorem ipsum dolor sit amet, tempor prodesset eos no.</p></center>
</div>
</div>
</div>
<br><br>
<div class="navbar navbar-inverse navbar-static-bottom">
<div class="container">
<div class="navbar-text pull-left">
<b style="color: #F5F6F7">© HOLO</b>
<br>
Contact:<br>
<i class="fa fa-user"></i> Swapnil Sourabh<br>
<i class="fa fa-map-marker" ></i> K004, Winewood Street, California, USA<br>
<i class="fa fa-phone" ></i>+1 454 658 255
</div>
<div class="navbar-text pull-right">
<div >Follow us on : </div>
<span style="font-size:2.5em;display: inline-block;margin-left:.21em"><a href="https://www.facebook.com" target="blank"> <i class="fab fa-facebook" > </i></a></span><spacer>
<span style="font-size:2.5em;display: inline-block;margin-left:.21em"><a href="https://twitter.com" target="blank" ><i class="fab fa-twitter" ></i></a></span> <spacer>
<span style="font-size:2.5em;display: inline-block;margin-left:.21em"> <a href="mailto:[email protected]" > <i class="fas fa-envelope" > </i></a></span>
<span style="font-size:2.5em;display: inline-block;margin-left:.21em"> <a href="https://www.linkedin.com" target="blank"> <i class="fab fa-linkedin" > </i></a></span><spacer>
</div>
</div>
</div>
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</body>
</html>