elixirDTU/index.html at master · pg07codes/elixirDTU · GitHub

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
226
227
228
229
230
231
232
233
234
235
236
<!doctype html>
<html lang="en" xmlns:og="http://ogp.me/ns#">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <title>Elixir | Delhi Technological University</title>

    <!--for search engine optimization(SEO)-->

    <!-- Search Engine -->
    <meta name="description"
          content="elixir is the health and fitness society of Delhi Technological University started with the aim of promoting health and wellness among engineering students">
    <meta name="image" content="./assets/images/logo-elixir.png">

    <!-- Schema.org for Google -->
    <meta itemprop="name" content="Elixir DTU , Health and Fitness society of Delhi Technological University">
    <meta itemprop="description"
          content="elixir is the health and fitness society of Delhi Technological University started with the aim of promoting health and wellness among engineering students">
    <meta itemprop="image" content="./assets/images/logo-elixir.png">

    <!-- Open Graph general (Facebook, Pinterest & Google+) -->
    <meta property="og:title" content="Elixir DTU , Health and Fitness society of Delhi Technological University" />
    <meta name="og:description"
          content="elixir is the health and fitness society of Delhi Technological University started with the aim of promoting health and wellness among engineering students">
    <meta property="og:type" content="website" />
    <meta property="og:url" content="https://pg07codes.github.io/elixirDTU/" />
    <meta property="og:image" content="./assets/images/logo-elixir.png" />
    <meta property="og:site_name" content="Elixir DTU" />

    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" crossorigin="anonymous">
    <link rel="stylesheet" href="./assets/css/loaders.css">
    <link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootswatch/4.1.2/lux/bootstrap.min.css">
    <link rel="stylesheet" href="./assets/css/customStyles.css">
    <link rel="icon" href="./assets/images/favicon.png">

</head>

<body>
<!--preloader is here-->
<div id="preload">
    <div class="loader">
        <div class="line-scale">
            <div></div>
            <div></div>
            <div></div>
            <div></div>
            <div></div>
        </div>
    </div>
</div>
<!--preloader ends here-->

<!--navbar component-->
<nav class="navbar navbar-expand-lg navbar-dark">
    <a class="navbar-brand" href="#banner-head">
        <img id="logo" src="./assets/images/LogoMono.png" width="40" height="50" class="d-inline-block align-top" alt="elixir,DTU">
    </a>
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
    </button>
    <div class="collapse navbar-collapse" id="navbarNavDropdown">
        <ul class="navbar-nav mx-auto">
            <!--<li class="nav-item">-->

                <!--<a class="nav-link" id="link" href="#banner-head"><i class="fas fa-home fa-nav"></i>Home</a>-->
            <!--</li>-->
            <li class="nav-item">
                <a class="nav-link" id="link1" href="#what-we-do"><i class="fas fa-pen-fancy fa-nav"></i>About Us</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" id="link2" href="#who-can-join"><i class="fas fa-suitcase fa-nav"></i>Who can join ?</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" id="link4" href="#connect"><i class="fas fa-comment-alt fa-nav"></i>Connect</a>
            </li>
        </ul>
    </div>
</nav>
<!--navbar component ends-->
    <div class="container-fluid banner" id="banner-head">
        <div class="row justify-content-center heading">
            <div class="col-md-10 ">
                <h1 class="text-center" style="color:whitesmoke; font-weight: lighter; font-size: 6vw; letter-spacing: 5pt; border-bottom: #9D6A2A solid 2px;">ELIXIR</h1>
            </div>
            <div class="col-md-10">
                <h3 class="text-center" style="color:rgba(255, 255, 255, 0.6);font-size: 1.8vw">the health society of Delhi Technological University</h3>
            </div>
        </div>
    </div>

<div id="theme"></div>

<!--about US part-->
<div class="container-fluid" id="what-we-do">
    <div class="row justify-content-center">
        <h1 class="col-md-9" data-aos="slide-down" data-aos-duration="600"><i class="fas fa-check-double" style="margin:2vh; color:#EF5324;"></i>What we do.</h1>
        <p class="col-md-9" data-aos="slide-up" data-aos-duration="900">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
            eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad
            minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex e
            a commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
            esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non pr
            oident, sunt in culpa qui officia deserunt mollit anim id est laborum.
            <br>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
            eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad
            minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex e
            a commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
            esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non pr
            oident, sunt in culpa qui officia deserunt mollit anim id est laborum.
            <br>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
            eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad
            minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex e
            a commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
            esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non pr
            oident, sunt in culpa qui officia deserunt mollit anim id est laborum.
            <br>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
            eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad
            minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex e
            a commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit
            esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non pr
            oident, sunt in culpa qui officia deserunt mollit anim id est laborum.
        </p>
    </div>
    <div id="img-group" class="row justify-content-center">
        <div class="col-md-3 m-3" data-aos="slide-up" data-aos-duration="600">
            <img src="./assets/images/x%20(142).jpg" height="300px" width="300px" class="img-fluid" alt="Responsive image">
        </div>
        <div class="col-md-3 m-3" data-aos="slide-up" data-aos-duration="600">
            <img src="./assets/images/x%20(141).jpg" height="300px" width="300px" class="img-fluid" alt="Responsive image">
        </div>
        <div class="col-md-3 m-3" data-aos="slide-up" data-aos-duration="600">
            <img src="./assets/images/x%20(140).jpg" height="300px" width="300px" class="img-fluid" alt="Responsive image">
        </div>
        <div class="col-md-3 m-3" data-aos="slide-up" data-aos-duration="600">
            <img src="./assets/images/x%20(141).jpg" height="300px" width="300px" class="img-fluid" alt="Responsive image">
        </div>
        <div class="col-md-3 m-3" data-aos="slide-up" data-aos-duration="600">
            <img src="./assets/images/x%20(140).jpg" height="300px" width="300px" class="img-fluid" alt="Responsive image">
        </div>
        <div class="col-md-3 m-3" data-aos="slide-up" data-aos-duration="600">
            <img src="./assets/images/x%20(142).jpg" height="300px" width="300px" class="img-fluid" alt="Responsive image">
        </div>
    </div>

</div>
<!--about US part ends here-->

<!--who can join us-->
<div class="container-fluid info-card-group" id="who-can-join-us">
<!--this section links to the #who-can-join-page component-->
    <div class="row justify-content-center">
        <div class="col-md-5 col-sm-6 left-box">
            <div class="row justify-content-center mt-5">
                <div class="col-md-12 col-sm-12 mt-4 mb-4">
                    <h2 align="center" style="color: whitesmoke">Participate in sessions</h2>
                </div>
                <div class="col-md-12 col-md-12">
                    <hr style="margin:10px auto; width:60px; border: 2px solid #5ac88b; background: #5ac88b">
                </div>
                <div class="col-md-12 col-sm-12">
                    <p align="center">Being healthy is the best gift you can give to yourself.
                        Participate in the various sessions organised by Elixir by registering with us
                        and be healthy and fit.</p>
                </div>
                <div class="col-md-5 col-sm-8">
                    <button class="btn btn-outline-success">Register to attend</button>
                </div>

            </div>
        </div>
        <div class="col-md-5 col-sm-6 mb-5">
            <div class="row justify-content-center mt-5">
                <div class="col-md-12 col-sm-12 mt-4 mb-4">
                    <h2 align="center" style="color: whitesmoke">Become a team member</h2>
                </div>
                <div class="col-md-12 col-md-12">
                    <hr style="margin:10px auto; width:60px; border: 2px solid #5ac88b; background: #5ac88b">
                </div>
                <div class="col-md-12 col-sm-12">
                    <p align="center">You can apply to be a member of the organising team and
                        be a part of the various departments at Elixir — Content,
                        PR & Publicity, IT & Design, Corporate, Logistics, Health Expert.</p>
                </div>
                <div class="col-md-5 col-sm-8">
                    <a href="./JOINING-ELIXIR.html">
                        <button class="btn btn-outline-success">Apply for membership</button>
                    </a>
                </div>

            </div>
        </div>
    </div>

</div>
<!--who can join us ends here-->

<!--connect with us-->
<div class="container-fluid" id="connect">
    <div class="row justify-content-center">
        <div class="col-md-5 col-sm-6 mt-5" data-aos="slide-down" data-aos-duration="800">
            <h2 style="color:#FFF; display: inline-block;"><i class="fas fa-comments fa-2x" style="margin:2vh; color:#EF5324;"></i>Let's connect !!</h2>
        </div>
    </div>
    <div class="row justify-content-center">
        <div class="col-md-5 col-sm-6 mt-3" style="font-size: 24pt" >
            <a href="https://www.facebook.com/elixirHealthSociety/" target="_blank"><i class="sm_handles fab fa-facebook-f"></i></a>
            <a href="#" target="_blank"><i class="sm_handles fab fa-medium-m"></i></a>
            <a href="mailto:elixir.healthsociety@gmail.com"><i class=" sm_handles far fa-lg fa-envelope-open"></i></a>
            <a href="https://www.linkedin.com/company/elixir-dtu-health-club-123/"><i class=" sm_handles fab fa-lg fa-linkedin-in"></i></a>
            <a href="https://www.instagram.com/elixir.healthsociety/" target="_blank"><i class="sm_handles fab fa-lg fa-instagram"></i></a>
        </div>
    </div>
</div>
<!--connect with us ends here-->


<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://unpkg.com/aos@next/dist/aos.js"></script>
<script>
    AOS.init({
        once:true,
        offset:120,
    });
</script>
<script src="./assets/js/customjs.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>

</body>
</html>