A Project Report[2]
A Project Report[2]
A Project Report[2]
On
TOUR AND TRAVELS
Submitted by
TUSHAR SHARMA, 2242000546
UDAYVEER, 2242000549
UMESH, 2242000552
UMESH PANDEY, 2242000553
URVASHI AGRAWAL, 2242000554
UTKARSH SONI, 2242000555
Supervisor
Mr.Naveen kumar Agrawal
GLA University, Mathura
We Tushar Sharma, BCA and Ist Year, 2242000546, Udayveer, BCA and Ist Year,
2242000549, Umesh, BCA and Ist Year, 2242000552, Umesh Pandey, BCA and Ist Year,
2242000553 , Urvashi Agrawal, BCA and Ist Year,2242000554,Utkarshi Soni, BCA and Ist
year,2242000555, hereby declare that the work presented in this project report entitled
Personal Assistant Software is an authentic record of our own work carried out under
supervision of Mr. Naveen kumar agrawal and GLA university, Mathura.
This is to certify that the above statement made by the students are correct to the
best of my knowledge and belief.
Date:19/05/2023
Place: Mathura
Introduction:
Welcome to our tour and travel website, the ultimate destination for
all your travel needs. Whether you're an avid explorer or a first-time
traveler, we're here to help you discover and plan your dream
vacations effortlessly. With our user-friendly interface, comprehensive
travel information, and a wide range of services, we ensure that your
journey from inspiration to booking is seamless and enjoyable.
page.
Hyper Text: HyperText simply means "Text within Text." A text has a link within it, is a hypertext.
Whenever you click on a link which brings you to a new webpage, you have clicked on a hypertext.
HyperText is a way to link two or more web pages (HTML documents) with each other.
Markup language: A markup language is a computer
language that is used to apply layout and formatting
conventions to a text document. Markup language makes
text more interactive and dynamic. It can turn text into
images, tables, links, etc.
CSS:-
CSS stands for Cascading Style Sheets
CSS is used to define styles for your web pages,
including the design, layout and variations in
display for different devices and screen sizes.
Source Code
<!DOCTYPE html>
<html lang="en">
<head>
/*=============================Banner=============================
*/
.banner {
background-image: url("C:/Users/Lenovo/Pictures/man.jpg");
background-size: cover;
background-repeat: no-repeat;
background-position: center;
/*overflow: hidden;*/
width: 100%;
height: 100vh;
text-align: center;
position: relative;
display: flex;
justify-content: center;
align-items: center;
}
.banner::before {
content: "";
position: absolute;
display: block;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: rgba(0, 0, 0, 0.2);
/*background-size: 100%;*/
}
.banner-text-item {
position: absolute;
width: 100%;
text-align: center;
display: flex;
flex-flow: column wrap;
justify-content: center;
align-items: center;
}
.banner-heading {
flex: 1;
}
.banner-heading h1 {
font-size: 100px;
font-weight: normal;
color: #fde02f;
font-family: Satisfy;
}
.banner-text-item .form {
flex: 1;
display: flex;
flex-flow: row wrap;
justify-content: center;
align-items: center;
background-color: rgba(255, 255, 255, 0.2);
border-radius: 5px;
width: 70%;
padding: 1% 2%;
}
.banner-text-item input,
.banner-text-item .date,
.banner-text-item .book {
padding: 15px;
margin-right: 10px;
font-size: 18px;
font-family: Roboto;
border-radius: 5px;
outline: 0;
border: none;
}
.banner-text-item input {
width: 50%;
flex: 2;
}
.banner-text-item .book {
width: 20%;
flex: 1;
}
.banner-text-item .book {
text-decoration: none;
color: #000;
text-transform: uppercase;
padding: 15px;
cursor: pointer;
background-color: #fde02f;
font-size: 16px;
font-weight: normal;
font-family: "Barlow Condensed";
width: 20%;
}
</style>
</head>
<body>
<!--===========Nav Bar=================-->
<section class="nav-bar">
<div class="logo">Star Travel</div>
<ul class="menu">
<li><a href="C:/Users/Lenovo/Documents/home.html">Home</a></li>
<li><a href="C:/Users/Lenovo/Documents/tour1.html">Tours</a></li>
<li><a
href="C:/Users/Lenovo/Documents/java.html">package</a></li>
<li><a href="C:/Users/Lenovo/Documents/about.html">about
us</a></li>
<li><a href="C:/Users/Lenovo/Documents/contactus.html">contact
us</a></li>
</ul>
</div>
</section>
<!--===============Banner================-->
<section class="banner">
<div class="banner-text-item">
<div class="banner-heading">
<h1><b>Find your Next tour!</b></h1>
</div>
<form class="form">
<input type="text" list="mylist" placeholder="Where would you like
to go?">
<datalist id="mylist">
<option>Shri Krishna Janamsthan</option>
<option>Prem Mandir</option>
<option>Govardhan Hill</option>
<option>Vishram Ghat</option>
<option>Vaishno Devi Dham</option>
<option>Shriji Temple</option>
</datalist>
<a
href="C:/Users/Lenovo/Documents/tour1.html"class="book">Search</a>
</form>
</div>
</section>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
/*=============================Banner=============================
*/
.banner {
background-image: url("C:/Users/Lenovo/Pictures/man.jpg");
background-size: cover;
background-repeat: no-repeat;
background-position: center;
/*overflow: hidden;*/
width: 100%;
height: 100vh;
text-align: center;
position: relative;
display: flex;
justify-content: center;
align-items: center;
}
.banner::before {
content: "";
position: absolute;
display: block;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: rgba(0, 0, 0, 0.2);
/*background-size: 100%;*/
}
.banner-text-item {
position: absolute;
width: 100%;
text-align: center;
display: flex;
flex-flow: column wrap;
justify-content: center;
align-items: center;
}
.banner-heading {
flex: 1;
}
.banner-heading h1 {
font-size: 100px;
font-weight: normal;
color: #fde02f;
font-family: Satisfy;
}
.banner-text-item .form {
flex: 1;
display: flex;
flex-flow: row wrap;
justify-content: center;
align-items: center;
background-color: rgba(255, 255, 255, 0.2);
border-radius: 5px;
width: 70%;
padding: 1% 2%;
}
.banner-text-item input,
.banner-text-item .date,
.banner-text-item .book {
padding: 15px;
margin-right: 10px;
font-size: 18px;
font-family: Roboto;
border-radius: 5px;
outline: 0;
border: none;
}
.banner-text-item input {
width: 50%;
flex: 2;
}
.banner-text-item .book {
width: 20%;
flex: 1;
}
.banner-text-item .book {
text-decoration: none;
color: #000;
text-transform: uppercase;
padding: 15px;
cursor: pointer;
background-color: #fde02f;
font-size: 16px;
font-weight: normal;
font-family: "Barlow Condensed";
width: 20%;
}
</style>
</head>
<body>
<!--===========Nav Bar=================-->
<section class="nav-bar">
<div class="logo">Star Travel</div>
<ul class="menu">
<li><a href="C:/Users/Lenovo/Documents/home.html">Home</a></li>
<li><a href="C:/Users/Lenovo/Documents/tour1.html">Tours</a></li>
<li><a
href="C:/Users/Lenovo/Documents/java.html">package</a></li>
<li><a href="C:/Users/Lenovo/Documents/about.html">about
us</a></li>
<li><a href="C:/Users/Lenovo/Documents/contactus.html">contact
us</a></li>
</ul>
</div>
</section>
<!--===============Banner================-->
<section class="banner">
<div class="banner-text-item">
<div class="banner-heading">
<h1><b>Find your Next tour!</b></h1>
</div>
<form class="form">
<input type="text" list="mylist" placeholder="Where would you like
to go?">
<datalist id="mylist">
<option>Shri Krishna Janamsthan</option>
<option>Prem Mandir</option>
<option>Govardhan Hill</option>
<option>Vishram Ghat</option>
<option>Vaishno Devi Dham</option>
<option>Shriji Temple</option>
</datalist>
<a
href="C:/Users/Lenovo/Documents/tour1.html"class="book">Search</a>
</form>
</div>
</section>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="E:\vscode\links.css"/>
<title>Star Travel</title>
<style>
.next {
background-color: #04AA6D;
color: white;
}
.gel {
padding-left : 30px;
padding-right : 20px;
}
</style>
</head>
<body>
<section class="nav-bar">
<div class="logo">Star Travel</div>
<ul class="menu">
<li><a href="C:/Users/Lenovo/Documents/home.html">Home</a></li>
<li><a href="C:/Users/Lenovo/Documents/tour1.html">Tours</a></li>
<li><a
href="C:/Users/Lenovo/Documents/java.html">package</a></li>
<li><a href="C:/Users/Lenovo/Documents/about.html">about
us</a></li>
<li><a href="C:/Users/Lenovo/Documents/contactus.html">contact
us</a></li>
</ul>
</div>
</section>
<section class="gel">><br><br>
<div><font color="red">
<h2><font size="10"><b>4. Vishram Ghat</b></font></h2></font>
<br><br>
<center>
<img src="E:\sem 2\math\vishram.jpg"width="40%"height="10%">
</center>
<br><br>
<p><font size="5">
Vishram Ghat is a revered and sacred bathing ghat located at about 4.5
kilometres from Mathura Junction on the banks of River Yamuna. It is the main
ghat of Mathura and is central to 25 other ghats. Pilgrims from all over the
country visit Vishram Ghat to bathe in its holy waters and perform the
traditional parikrama that starts and ends here.
Vishram means rest and it is named so because Lord Krishna rested at this place
after killing Kansa, the evil demon king. This is the reason why a pilgrimage to
Mathura is incomplete without a visit to Vishram Ghat and the temples dotting
it. There are 12 ghats to the north of Vishram Ghat and 12 ghats to the south of
it positioning it in the centre. The parikrama is the circumambulation of all the
chief religious places of Mathura.
<br><br>
<div><font color="red">
<h2><font size="10"><b>5. Vaishno Devi Dham</b></h2>
</font></font>
<br>
<center>
<img src="E:\sem 2\math\devi.jpg"width="40%"height="05%">
</center>
<br><br>
<p><font size="5">
Vaishno Devi Dham in Mathura, popularly known as Ma Vaishno Devi Mandir is
dedicated to Ma Vaishno Devi who is believed to grant boons to her devotees.
Established by Shri J C. Chaudhry, the temple is visited by pilgrims to worship
the magnificent idol of Ma Vaishno Devi alongside serving the poor. There is a
cave that with water that leads to the top of the idol.
The Vaishno Devi Dham of Mathura has an attached dispensary and library for
the pilgrims. In addition to that, it has two dharamshalas to provide
accommodation to the visiting devotees. The main central hall is used for
meditation and adjacent to it is the yoga hall. The place where Vaishno Devi
Dham is located is believed to be very auspicious and associate with the
childhood of Lord Krishna.
<section><br><br>
<center>
<a href="contactus.html" class="um">BOOK</a></center></b>
<br><br>
<div><font color="red">
<h2><font size="10"><b>6. Jai Gurudev Mandir</b></font></h2></font>
<br><br>
<center>
<img src="E:\sem 2\math\jay.jpg"width="40%"height="10%">
</center>
<br><br>
<p><font size="5"> Also known as Naam Yog Sadhna Mandir, Jaigurudev Mandir
is dedicated to Baba Jai Gurudev, located on the National Highway 2, between
Delhi and Agra. The celebrated man is a revered guruji among the devotees and
he also runs a charitable organization and ashram. The temple hosts an annual
Bhandaar festival which attracts hordes of pilgrims.
The temple is managed by the Jai Guru Dev Ashram and they do not charge
anything from the public for entering. Visitors seeking peace and enlightenment
from all over the country converge at this temple to worship Guru ji who is
believed to lead them to the path of immortality. It is not just pilgrims and
devotees who visit this temple. The architectural beauty of Jai Gurudev Temple
attracts many architecture buffs as well, who gather to see the temple that
resembles Taj Mahal. Built of white marbles, with domed structures and
minarets in the temple complex, it is based on Hindu architecture.
<br><br>
<br>
<b><br><center>
<a href="contactus.html" class="um">BOOK</a></center></b>
<br><br>
<center>
<a href="C:/Users/Lenovo/Documents/tour1.html" class="next">Previous</a>
<a href="C:/Users/Lenovo/Documents/tour3.html"
class="next">Next</a></center></b>
<br><br>
<br><br><br>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="E:\vscode\links.css"/>
<title>Star Travel</title>
<style>
.next {
background-color: #04AA6D;
color: white;
}
.gel {
padding-left : 30px;
padding-right : 20px;
}
</style>
</head>
<body>
<section class="nav-bar">
<div class="logo">Star Travel</div>
<ul class="menu">
<li><a href="C:/Users/Lenovo/Documents/home.html">Home</a></li>
<li><a href="C:/Users/Lenovo/Documents/tour1.html">Tours</a></li>
<li><a
href="C:/Users/Lenovo/Documents/java.html">package</a></li>
<li><a href="C:/Users/Lenovo/Documents/about.html">about
us</a></li>
<li><a href="C:/Users/Lenovo/Documents/contactus.html">contact
us</a></li>
</ul>
</div>
</section>
<section class="gel"><br><br>
<div><font color="red">
<h2><font size="10"><b>10. Shriji Temple</b></h2>
</font></font>
<br>
<center>
<img src="E:\sem 2\math\shri.jpg"width="40%"height="05%">
</center>
<br><br>
<p><font size="5">
The Shriji Temple also known as the Radha Rani Temple in Barsana, resembles
structures that date back to the Mughal era with pillars and arches. This temple
is situated on the Bhanugarh Peak of Barsana and is dedicated to Radha, who
was born in that town. Barsana is a part of the Braj Bhoomi region which sees
the most number of devotees coming in just to visit this particular temple. In
order to get to the temple, you have to climb almost 200 steps and then you can
go see the preciding deity of Radha and Krishna. Also, there are many paintings
on the walls inside the temples that show images of Radha and Krishna.
<section><br><br>
<center>
<a href="contactus.html" class="um">BOOK</a></center></b>
<br><br>
<div><font color="red">
<h2><font size="10"><b>11. Kirti Mandir</b></font></h2></font>
<br><br>
<center>
<img src="E:\sem 2\math\kirti.jpg"width="40%"height="20%">
</center>
<br><br>
<p><font size="5">Located in the heart of the city is the famous Kirti Temple
that is dedicated to Radha's divine mother Kirti Mayia, after who the temple has
been named. This is the only temple in the entire world that has an idol of
Radharani sitting on her mother's lap. The temple is famous and is located right
next to the Rangeeli Mahal. The architecture of this structure is absolutely
architecturally sound with intricate detailing and a beautiful lawn right in front
of it where you can sit and relax.
<section><br><br>
<center>
<a href="contactus.html" class="um">BOOK</a></center></b>
<br><br>
<div><font color="red">
<h2><font size="10"><b>12. Lathmar Holi</b></font></h2></font>
<br><br>
<center>
<img src="E:\sem 2\math\holi.jpg"width="40%"height="10%">
</center>
<br><br>
<p><font size="5">Lathmar Holi is celebrated 4-5 days prior to the Holi
festivities of other states. However, it is interesting to note how this festival is
celebrated in a rather peculiar way in Nandgaon and Barsana towns in Mathura-
district of Uttar Pradesh. The towns are located some 42 kms from Mathura and
are extremely popular for the celebrations during Holi.
The natives are known for their interesting way of playing Holi with not only
colours but also sticks. Lathmar Holi is a Hindi word that literally translates -
'Lath' means stick, 'mar' means beat and togther they mean playing Holi with
stick and colours. Thandai (a sweet drink) and Holi go hand in hand, so don't
miss out on it!
<br><br><br>
<center>
<a href="contactus.html" class="um">BOOK</a></center></b>
<br><br>
<br><center>
<b><a href="C:/Users/Lenovo/Documents/tour3.html"
class="next">Previous</a>
<br><br>
<br><br><br>
</body>
</html>
<html>
<head>
<title>Star Travel</title>
<style>
*{
box-sizing: border-box;
margin: 0;
}
body {
background-color: #f2f2f2;
}
html {
margin: 0;
padding: 0;
}
/*========================Nav Bar=========================*/
.nav-bar {
display: flex;
flex-flow: row wrap;
width: 100%;
height: 90px;
background-color: #0275dd;
box-shadow: 3px 3px 10px grey;
align-items: center;
justify-content: center;
position: sticky;
top: 0;
z-index: 1;
}
.logo {
flex: 1;
font-size: 40px;
padding: 20px;
margin-left: 50px;
font-family: Satisfy;
}
ul.menu {
flex: 1;
display: flex;
flex-flow: row wrap;
}
.menu li {
flex: 1;
list-style-type: none;
font-size: 16px;
font-family: "Barlow Condensed";
text-align: center;
}
.menu li a {
text-decoration: none;
color: #000;
text-transform: uppercase;
}
a{
text-decoration: none;
display: inline-block;
padding: 8px 16px;
}
a:hover {
background-color: #ddd;
color: red;
}
/*=============================Places=============================
==*/
.places-text {
text-align: center;
margin-bottom: 50px;
}
.places-text small {
font-family: Roboto;
color: #ffc342;
font-size: 15px;
font-weight: bolder;
}
.places-text h2 {
font-family: Barlow Condensed;
font-size: 55px;
color: #191d34;
letter-spacing: 1px;
}
.cards {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(2, 1fr);
grid-gap: 30px;
align-items: center;
justify-items: center;
text-align: center;
}
.card {
border: 1px solid lightgray;
box-shadow: 2px 2px 6px 0 rgba(0, 0, 0, 0.3);
border-top-left-radius: 8px;
border-top-right-radius: 8px;
width: 80%;
height: auto;
}
.card img {
max-width: 100%;
height: 300px;
border-radius: 8px;
cursor: pointer;
}
.cards .text {
padding: 20px;
font-family: Barlow Condensed;
line-height: 50px;
}
.cards .card-box {
display: flex;
flex-flow: row;
background-color: #fde02f;
font-size: 18px;
font-family: Roboto;
align-items: center;
justify-content: center;
text-align: center;
}
.cards .location {
flex: 2;
}
.cards .cost {
color: #4cafad;
font-size: 20px;
}
</style>
</head>
<body>
<!--===========Nav Bar=================-->
<section class="nav-bar">
<div class="logo">Star Travel</div>
<ul class="menu">
<li><a href="C:/Users/Lenovo/Documents/home.html">Home</a></li>
<li><a href="C:/Users/Lenovo/Documents/tour1.html">Tours</a></li>
<li><a
href="C:/Users/Lenovo/Documents/java.html">package</a></li>
<li><a href="C:/Users/Lenovo/Documents/about.html">about
us</a></li>
<li><a href="C:/Users/Lenovo/Documents/contactus.html">contact
us</a></li>
</ul>
</div>
</section>
<!--==============Places===================-->
<section class="places">
<div class="places-text"><br>
<br>
<b><small>FEATURED TOURS PACKAGES</small><b>
<h2>Favourite Places</h2>
</div>
<div class="cards">
<div class="card">
<div class="zoom-img">
<div class="img-card">
<img
src="E:\sem 2\math\a4.jpg">
</div>
</div>
<div class="text">
<span class="rating"> </span>
<h2>Shri Krishna Janamsthan</h2>
<p class="cost">Mathura</p>
<div class="card-box">
<a href="C:/Users/Lenovo/Documents/contactus.html">
<p class="location">Rs.2000 Fees</p></a>
</div>
</div>
</div>
<div class="card">
<div class="zoom-img">
<div class="img-card">
<img src="E:\sem 2\math\prem.jpg">
</div>
</div>
<div class="text">
<span class="rating"> </span>
<h2>Prem Mandir</h2>
<p class="cost">Vrindavan</p>
<div class="card-box">
<a href="C:/Users/Lenovo/Documents/contactus.html">
<p class="location">Rs.3000 Fees</p></a>
</div>
</div>
</div>
<div class="card">
<div class="zoom-img">
<div class="img-card">
<img src="E:\sem 2\math\hill.jpeg">
</div>
</div>
<div class="text">
<span class="rating"> </span>
<h2>Govardhan Hill</h2>
<p class="cost"> Mathura</p>
<div class="card-box">
<a href="C:/Users/Lenovo/Documents/contactus.html">
<p class="location">Rs.1000 Fees</p></a>
</div>
</div>
</div>
<div class="card">
<div class="zoom-img">
<div class="img-card">
<img
src="E:\sem 2\math\vishram.jpg">
</div>
</div>
<div class="text">
<span class="rating"> </span>
<h2>Vishram Ghat</h2>
<p class="cost">Mathura</p>
<div class="card-box">
<a href="C:/Users/Lenovo/Documents/contactus.html">
<p class="location">Rs.5000 Fees</p></a>
</div>
</div>
</div>
<div class="card">
<div class="zoom-img">
<div class="img-card">
<img src="E:\sem 2\math\devi.jpg">
</div>
</div>
<div class="text">
<span class="rating"> </span>
<h2>Vaishno Devi Dham</h2>
<p class="cost">Mathura</p>
<div class="card-box">
<a href="C:/Users/Lenovo/Documents/contactus.html">
<p class="location">Rs.4000 Fees</p></a>
</div>
</div>
</div>
<div class="card">
<div class="zoom-img">
<div class="img-card">
<img
src="E:\sem 2\math\shri.jpg">
</div>
</div>
<div class="text">
<span class="rating"> </span>
<h2>Shriji Temple</h2>
<p class="cost">Barsana</p>
<div class="card-box">
<a href="C:/Users/Lenovo/Documents/contactus.html">
<p class="location">Rs.8000 Fees</p></a>
</div>
</div>
</div>
</div>
</section>
<br><br>
<br>
<br><br>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="E:\vscode\links.css" />
<style>
/------marquee------/
.main {
text-align: center;
font-family: "Times New Roman";
background-color: aqua;
float: left;
}
.main img{
position: relative;
left: -170px;
}
.marq {
padding-bottom: 60px;
height: 400px;
position: relative;
left: 450px;
top: -400px;
}
.ges {
font-size: 28px;
font-weight: bold;
color: blue;
text-align: center;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
.ges span{
color: brown;
text-decoration: underline;
font-size: 36px;
font-weight: bold;
}
.ges img{
height: 250px;
position: relative;
left: 10px;
top: 40px;
}
</style>
</head>
<body>
<section class="nav-bar">
<div class="logo">Star Travel</div>
<ul class="menu">
<li><a href="C:/Users/Lenovo/Documents/home.html">Home</a></li>
<li><a href="C:/Users/Lenovo/Documents/tour1.html">Tours</a></li>
<li><a
href="C:/Users/Lenovo/Documents/java.html">package</a></li>
<li><a href="C:/Users/Lenovo/Documents/about.html">about
us</a></li>
<li><a href="C:/Users/Lenovo/Documents/contactus.html">contact
us</a></li>
</ul>
</div>
</section>
<br><br><center><table border="1"width="100%"
bgcolor="skyblue">
<tr><th>
<font size="6"><b><h1>Our Team</h1></b></font>
</th></tr></table></center>
<br><br>
<div class="main">
<img src="C:\Users\Lenovo\Pictures\Logo.jpeg" alt="Sorry">
<marquee class="marq"
direction="up"
scrollamount="8">
<div class="ges1"></div>
<div class="ges"><img src="C:\Users\Lenovo\Pictures\Logo.jpeg"
alt="Sorry"><br><br><span >Welcome to Star Travels</span><br><br>Tushar
sharma<br><br>Umesh Pandey<br><br>Utkarsh Soni<br><br>Urvashi
Agrawal<br><br>Umesh<br><br>Udayveer</div>
</marquee>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="E:\vscode\links.css" />
<title>Star Travel</title>
<style>
/-----contact us------/
*{
box-sizing: border-box;
}
/* Style inputs */
input[type=text], input[type=number], select, textarea {
width: 100%;
padding: 12px;
border: 1px solid #ccc;
margin-top: 6px;
margin-bottom: 16px;
resize: vertical;
}
input[type=submit] {
background-color: #04AA6D;
color: white;
padding: 12px 20px;
border: none;
cursor: pointer;
}
input[type=submit]:hover {
background-color: #45a049;
}
#email{
height: 40px;
width: 100%;
}
</style>
</head>
<body>
<section class="nav-bar">
<div class="logo">Star Travel</div>
<ul class="menu">
<li><a href="C:/Users/Lenovo/Documents/home.html">Home</a></li>
<li><a href="C:/Users/Lenovo/Documents/tour1.html">Tours</a></li>
<li><a
href="C:/Users/Lenovo/Documents/java.html">package</a></li>
<li><a href="C:/Users/Lenovo/Documents/about.html">about
us</a></li>
<li><a href="C:/Users/Lenovo/Documents/contactus.html">contact
us</a></li>
</ul>
</div>
</section>
<center>
<h2>Contact Us</h2>
<p>Swing by for a cup of coffee, or leave us a message:</p></center>
</div>
<br>
<br>
<div class="row">
<div class="column">
<img src="C:\Users\DELL\Pictures\email.jpg"style="width:100%">
</div>
<div class="column">
<form action="submit.html">
<label for="fname">Name</label>
<input type="text" id="fname" name="firstname" placeholder="Your
name.."required>
<option value="usa">India</option>
<option value="australia">Australia</option>
<option value="canada">Canada</option>
<option value="usa">USA</option>
<option value="usa">Other</option>
</select>
<label for="Type">Type Vehicle</label><br>
<select id="Type" name="Type">
<option value="Shift">Shift</option>
<option value="Innova">Innova</option>
<option value="Ertiga">Ertiga</option>
<option value="Eeco">Eeco</option>
<option value="Bus">Bus</option>
</select>
<label for="subject">Subject</label>
*{
box-sizing: border-box;
margin: 0;
}
body,
html {
margin: 0;
padding: 0;
}
/*========================Nav Bar=========================*/
.nav-bar {
display: flex;
flex-flow: row wrap;
width: 100%;
height: 90px;
background-color: #0275dd;
box-shadow: 3px 3px 10px grey;
align-items: center;
justify-content: center;
position: sticky;
top: 0;
z-index: 1;
}
.logo {
flex: 1;
font-size: 40px;
padding: 20px;
margin-left: 50px;
font-family: Satisfy;
}
ul.menu {
flex: 1;
display: flex;
flex-flow: row wrap;
}
.menu li {
flex: 1;
list-style-type: none;
font-size: 16px;
font-family: "Barlow Condensed";
text-align: center;
}
.menu li a {
text-decoration: none;
color: #000;
text-transform: uppercase;
}
a{
text-decoration: none;
display: inline-block;
padding: 8px 16px;
}
a:hover {
background-color: #ddd;
color: red;
}
Chapter – 3
• Websites referred
1. WWW.hostinger.com
2. Getbootstrap.com
3. www.tutorialspoint.com
4. www.geeksforgeeks.com