-
Notifications
You must be signed in to change notification settings - Fork 33
/
Copy pathhome.html
153 lines (134 loc) · 5.76 KB
/
home.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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<!-- Font awesome -->
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
<!-- Imports Bootstrap CSS -->
<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css">
<!-- Import CSS -->
<link rel="stylesheet" type="text/css" href="css/style.css">
<title>Mang Gym</title>
</head>
<body>
<!-- Navbar and Logo -->
<div class="container">
<nav class="navbar navbar-inverse navbar-static-top">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="index.html"><img src="img/mainlogo.svg" alt="Mang Gym">
</a>
</div>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar3" aria-controls="navbar3" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div id="navbar3" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="home.html" class="active">Home</a></li>
<li><a href="aboutus.html">About Us</a></li>
<li><a href="programs.html">Programs</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div><!--/.nav-collapse -->
</div><!--/.container-fluid -->
</nav>
</div>
<!-- Header Showcase -->
<header id="showcase" class="grid">
<div class="bg-image"></div>
<div class="content-wrap">
<h1>WELCOME TO <span style="color: yellow">MANG GYM</span></h1>
<p>A Haven for Everybody</p>
<a href="#" class="btn">Join Now!</a>
</div>
</header>
<!-- Main Area / Home -->
<main class="container">
<section id="trial">
<div class="freetrial">
<h1>FREE TRIAL</h1>
<p>Enjoy a 30 days FREE ACCESS to all of our classes and facilities</p>
<select id="location" name="Location">
<option value="" disabled selected>Select your location</option>
<option value="fairview">Fairview</option>
<option value="manila">Manila</option>
<option value="baguio">Baguio</option>
<option value="davao">Davao</option>
</select>
</div>
</section>
<!-- History -->
<section id="banner">
<div class="hero">
<h1>History of Gym</h1>
<img src="img/oldgym.jpeg" style="width:100%;" border="0" alt="Null">
<p>A gym, also referred as gymnasium, is an open air or covered location for gymnastics, athletics, and gymnastic services. The word is derived from the ancient Greek gymnasium. They are commonly found in athletic and fitness centers, and as activity and learning spaces in educational institutions. "Gym" is also slang for "fitness center", which is often an indoor facility.
Gymnasia apparatus such as barbells, parallel bars, jumping board, running path, tennis-balls, cricket field, fencing area, and so forth are used as exercises. In safe weather, outdoor locations are the most conducive to health. Gyms were popular in ancient Greece. Their curricula included Gymnastica militaria or self-defense, gymnastica medica, or physical therapy to help the sick and injured, and gymnastica athletica for physical fitness and sports, from boxing to dancing.</p>
</div>
</section>
<!-- Member's Gallery -->
<section id="gallery">
<h2>MEMBER'S GALLERY</h2>
<br>
<h2>DYNAMIC BODYBUILDING TRAININGS (DBT)</h2>
<div class="column">
<img src="img/program1.jpg">
<p>DMT uses the body’s natural movement patterns through three-dimensional exercises.</p>
</div>
<div class="column">
<img src="img/program2.jpg">
<p>Movements can just use your body weight or be loaded for greater benefit.</p>
</div>
<div class="column">
<img src="img/program3.jpg">
<p>Dynamic movement training is important to help you maintain a healthy body and healthy mind.</p>
</div>
<div class="column">
<img src="img/program4.jpg">
<p>Dynamic movement training is important to help you maintain a healthy body and healthy mind.</p>
</div>
</section>
<section id="newsletter">
<h2>Sign up for our EXCLUSIVE TRAINING Tips, Offers and Discounts</h2>
<p>We promise to only send you the good stuff! No Spam.</p>
<div class="newsform">
<form action="/action_page.php">
<input type="text" placeholder="Email address" name="mail" required>
<input type="submit" value="Subscribe">
</form>
</div>
</section>
</main>
<!-- Footer -->
<footer id="contact">
<small class="small-1">© Copyright 2017 | Stephene Canciller | <span style="color: yellow">Mang Gym</span> </small>
<div id="disclaimer">
<div class="disclaimer-last">
<small class="small-2">Disclaimer: No copyright infringement is intended. This is only for educational purposes and not for profit. Some asset/s used are not owned by the developer/s unless otherwise stated; the credit goes to the owner.</small>
</div>
</div>
<div id="socialMedia">
<div class="contact">
<i class="fa fa-facebook" aria-hidden="true"></i>
</div>
<div class="contact">
<i class="fa fa-twitter" aria-hidden="true"></i>
</div>
<div class="contact">
<i class="fa fa-instagram" aria-hidden="true"></i>
</div>
<div class="contact">
<i class="fa fa-youtube" aria-hidden="true"></i>
</div>
</div>
</footer>
<!-- Import Jquery -->
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<!-- Font Awesome CDN -->
<script src="https://use.fontawesome.com/5743362e56.js"></script>
<!-- Import Bootstrap Javascript -->
<script src="bootstrap/js/bootstrap.min.js"></script>
</body>
</html>