-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathproject1.html
225 lines (220 loc) · 8.38 KB
/
project1.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
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
body{
background-image: url(https://c1.wallpaperflare.com/preview/485/581/97/various-fitness-healthy-sport.jpg);
color: white;
}
.left{
/* border: 3px solid white; */
display: inline-block;
position: absolute;
left: 34px;
top: 20px;
}
.mid{
display: block;
width: 43%;
margin: 20px auto;
/* border: 3px solid white; */
}
.right{
/* border: 3px solid white; */
display: inline-block;
position: absolute;
right: 34px;
top: 20px;
}
.navbar{
display: inline-block;
position: sticky;
top: 0px;
}
.navbar li{
display: inline-block;
font-size: 25px;
}
.navbar li a{
color: white;
text-decoration: none;
font-weight: bold;
padding: 34px 23px;
}
.navbar li a:hover, .navbar li a:active{
text-decoration: underline;
color: goldenrod;
background-color: rgb(75, 8, 8);
}
.left img{
width: 173px;
filter: invert(100%);
}
.left div{
text-align: center;
font-size: 36px;
text-decoration: bold;
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}
.btn{
margin: 0px 7px;
background-color: black;
color: white;
padding: 4px 14px;
border: 2px solid white;
border-radius: 14px;
font-size: 15px;
font-weight: bold;
}
.btn:hover{
background-color: tomato;
}
.container{
border: 4px solid white;
margin: 200px 210px;
padding-left: 34px;
padding-bottom: 56px;
padding-top: 45px;
border-radius: 10px;
width: 55%;
font-size: 20px;
font-weight: bold;
}
.form-group input{
text-align: center;
display: block;
margin: 12px auto;
padding: 6px;
border: 2px solid white;
border-radius: 8px;
width: 408px;
font-size: 25px;
}
.container button{
margin-left: 198px;
width: 52%;
padding: 5px;
margin-top: 15px;
}
.container h1{
text-align: center;
}
input::placeholder{
font-weight: bold;
font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
color: black;
}
.para1{
/* color: goldenrod; */
border: 3px solid white;
margin-right: 934px;
width: 30;
padding: 63px 63px;
font-size: 20px;
}
.para2{
/* color: gray; */
border: 3px solid white;
width: 40%;
font-size: 25px;
padding: 63px 63px;
}
.para3{
border: 3px solid white;
width: 50%;
font-size: 30px;
padding: 63px 63px;
}
.para4{
border: 3px solid white;
font-size: 35px;
position: relative;
top: 0px;
width: 60%;
padding: 63px 63px;
}
.para5{
border: 3px solid white;
font-size: 40px;
position: relative;
top: 0px;
width: 70%;
padding: 63px 63px;
}
div .box{
border: 3px;
background-image: url(https://files.wallpaperpass.com/2019/10/fitness%20wallpaper%20137%20-%201900x1058.jpg);
}
</style>
</head>
<body>
<header>
<div class="left">
<img src="https://previews.123rf.com/images/09910190/099101901611/09910190161100055/69440477-dumbbell-black-icon-weight-lifting-dumbell-for-fitness-in-gym-vector-illustration.jpg">
<div>Fitness</div>
</div>
<div class="mid">
<ul class="navbar">
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Fitness contractor</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
<div class="right">
<button class="btn">Call us now</button>
<button class="btn">Email us</button>
</div>
</header>
<div class="container">
<h1>Join the best gym in Punjab now</h1>
<form action="nonaction.php">
<div class="form-group">
<input type="text" name="" placeholder="Enter your Name">
</div>
<div class="form-group">
<input type="text" name="" placeholder="Enter your Age">
</div>
<div class="form-group">
<input type="text" name="" placeholder="Enter your Gender">
</div>
<div class="form-group">
<input type="text" name="" placeholder="Enter your Locality">
</div>
<button class="btn">Submit</button>
</form>
</div>
<br>
<p class="para1">
<strong>GYM</strong> is one of the best place to enhance physique.This implies you to get knowledge about various equipments.It is the place where the people of any age group can do work-out.It is the uniform platform for all.The main thing is that it is having good infrastructure.
</p>
<p class="para2">
This is the special place that is having planned timings,experienced trainers,supporting faculty.We will try to give you every comfort.The <strong>GYM</strong> contains the large campus where you would get every instrument you desire to.It also contains the subway and healthy diet shop downstairs.It is having good infrastructure that is well equiped with AC and well seated.
</p>
<p class="para3">
So,if you desire to have admission in the gym then here is the procedure....You have to first fill the above form..Then you will recieve the call from our faculty for confirmation..then you would be asked regarding joining..After this you would be given two days free trial as per your interest.Then if you join the gym and have good time there then also you let your friends and family members to join the gym..As the more no. of memberships you give you would be given some concession or your membership to be free.
</p>
<p class="para4">
The fit person has a good personality and impact over others.Also a good physique let you to have good health and stay away from diseases.Most of the people are job workers or having the busy schedules,so they don't have time for such activities then joining <strong>GYM</strong> let them to have some time for physical activity.It is very important to have long and healthy life.Also doing diet and exercise under the trainer will let you to have good results in short timings.
</p>
<p class="para5">
As from the above context we came to know about various uses of the gym.So it is very important to have some physical activity.You are suggested to join gym because once you take membership it will let you to get full use of your membership and you would never let yourself to skip a day..Also once you get habbit of it then you would come to gym with your own interest.Specially,here you can enhance your physique using the proper guidance by the trainers...Also gym will give you chance to meet different people and have good interaction with them .It will let you to make friends.</p>
<!-- <div class="box">good</div>
<div class="box">good</div>
<div class="box">good</div>
<div class="box">good</div>
<div class="box">good</div>
<div class="box">good</div>
<div class="box">good</div>
<div class="box">good</div>
<div class="box">good</div>
<div class="box">good</div>
<div class="box">good</div>
<div class="box">good</div>
<div class="box">good</div>
<div class="box">good</div> -->
</body>
</html>