-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
221 lines (201 loc) · 11 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
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="//db.onlinewebfonts.com/c/c545a36000d0fe5eb6dd44b3cabda9cf?family=Posterama" rel="stylesheet"
type="text/css" />
<link rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
<link rel="stylesheet" href="style.css" />
<script src="script.js" defer></script>
<script src="https://code.jquery.com/jquery-3.6.1.min.js"
integrity="sha256-o88AwQnZB+VDvE9tvIXrMQaPlFFSUTR+nldQm1LuPXQ=" crossorigin="anonymous"></script>
<link rel="icon" href="aqsicon.png" type="image/x-icon" />
<title>Aquila Sprites</title>
</head>
<body>
<div class="smooth-scroll-wrapper">
<div class="fixed">WIP</div>
<header id="scrollHeader">
<div class="logo-wrapper" id="scrollLogo">
<a href="index.html" class="logo">
<img class="mainlogo" src="aqsicon.png" id="brand-logo" />
<div class="mainlogo" id="scrollName">
<p id="brand-name">AQS</p>
</div>
</a>
</div>
<div class="nav-wrapper">
<ul>
<li><a href="#">Esports</a></li>
<li><a href="#">Events</a></li>
<li>
<a href="#">Form</a>
</li>
<li><a href="#">About</a></li>
</ul>
</div>
<div class="account-wrapper">
<ul>
<li>
<a href="#">
<button class="join-btn">Join Us!</button>
</a>
</li>
</div>
</header>
<section id="section1">
<div class="area">
<ul class="circles-from-right">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<ul class="circles-from-left" id="circleAnimate">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
<div class="welcome">
<h1>Student Driven E-Sports Club Oganization (eme)</h1>
<a href="#anchor">
<div class="animate-welcome">
<img class="welcome-image" src="welcome-logo.png" alt="Logo of Aquila Sprites">
</div>
</a>
<i>Colegio de Los Baños'</i>
<h2>Aquila Sprites</h2>
</div>
</section>
<div class="socials-bar" id="socialsBar">
<ul>
<li>
<a href="https://www.facebook.com/AquilaSprites">
<?xml version="1.0" ?>
<!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg
height="100%" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"
version="1.1" viewBox="0 0 512 512" width="100%" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"
xmlns:serif="http://www.serif.com/" xmlns:xlink="http://www.w3.org/1999/xlink">
<path
d="M512,257.555c0,-141.385 -114.615,-256 -256,-256c-141.385,0 -256,114.615 -256,256c0,127.777 93.616,233.685 216,252.89l0,-178.89l-65,0l0,-74l65,0l0,-56.4c0,-64.16 38.219,-99.6 96.695,-99.6c28.009,0 57.305,5 57.305,5l0,63l-32.281,0c-31.801,0 -41.719,19.733 -41.719,39.978l0,48.022l71,0l-11.35,74l-59.65,0l0,178.89c122.385,-19.205 216,-125.113 216,-252.89Z"
style="fill-rule:nonzero; fill:#014040" />
</svg>
</a>
</li>
<hr class="rounded">
<li>
<a href="https://discord.gg/SHFBmdmuxg">
<?xml version="1.0" ?><svg viewBox="0 0 640 512" xmlns="http://www.w3.org/2000/svg">
<path
d="M524.531,69.836a1.5,1.5,0,0,0-.764-.7A485.065,485.065,0,0,0,404.081,32.03a1.816,1.816,0,0,0-1.923.91,337.461,337.461,0,0,0-14.9,30.6,447.848,447.848,0,0,0-134.426,0,309.541,309.541,0,0,0-15.135-30.6,1.89,1.89,0,0,0-1.924-.91A483.689,483.689,0,0,0,116.085,69.137a1.712,1.712,0,0,0-.788.676C39.068,183.651,18.186,294.69,28.43,404.354a2.016,2.016,0,0,0,.765,1.375A487.666,487.666,0,0,0,176.02,479.918a1.9,1.9,0,0,0,2.063-.676A348.2,348.2,0,0,0,208.12,430.4a1.86,1.86,0,0,0-1.019-2.588,321.173,321.173,0,0,1-45.868-21.853,1.885,1.885,0,0,1-.185-3.126c3.082-2.309,6.166-4.711,9.109-7.137a1.819,1.819,0,0,1,1.9-.256c96.229,43.917,200.41,43.917,295.5,0a1.812,1.812,0,0,1,1.924.233c2.944,2.426,6.027,4.851,9.132,7.16a1.884,1.884,0,0,1-.162,3.126,301.407,301.407,0,0,1-45.89,21.83,1.875,1.875,0,0,0-1,2.611,391.055,391.055,0,0,0,30.014,48.815,1.864,1.864,0,0,0,2.063.7A486.048,486.048,0,0,0,610.7,405.729a1.882,1.882,0,0,0,.765-1.352C623.729,277.594,590.933,167.465,524.531,69.836ZM222.491,337.58c-28.972,0-52.844-26.587-52.844-59.239S193.056,219.1,222.491,219.1c29.665,0,53.306,26.82,52.843,59.239C275.334,310.993,251.924,337.58,222.491,337.58Zm195.38,0c-28.971,0-52.843-26.587-52.843-59.239S388.437,219.1,417.871,219.1c29.667,0,53.307,26.82,52.844,59.239C470.715,310.993,447.538,337.58,417.871,337.58Z"
/ style="fill:#014040">
</svg>
</a>
</li>
<hr class="rounded">
<li>
<a href="https://app.acadarena.com/ph/community/CDLB">
<img id="acadarena" src="-acadarena.svg" alt=""></img>
</a>
</li>
</ul>
</div>
</div>
<section id="about-section">
<div class="about-grid">
<div class="content-grid1-1 grid">
<h2>What is Aquila Sprites?</h2>
<p>Aquila Sprites</p>
</div>
<div class="content-grid-2 grid">
<img src="-aqsmainlogo.svg" alt="">
</div>
<span class="anchor" id="anchor"></span>
</div>
</section>
<section id="section3">
<h2>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Beatae atque iusto tenetur ut magnam rem!</h2>
<p>
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Possimus ad, a explicabo atque voluptatem quibusdam.
Error incidunt maxime facilis veritatis optio perspiciatis mollitia accusantium, rem asperiores quas neque
facere, iste
delectus distinctio at aut. Magnam expedita doloribus accusamus possimus odio similique reprehenderit porro
consequuntur, tenetur obcaecati ipsum mollitia recusandae alias corrupti nulla aperiam distinctio architecto,
natus eaque a
provident quos unde ad! Fuga autem consequuntur rem minima, soluta quasi architecto non dolores totam tenetur
ipsam dicta blanditiis, quisquam vitae aliquid nobis beatae amet sint repellat est ducimus? Corrupti commodi et
ratione
illum, iusto aut autem in. Nam enim hic qui.
</p>
<i>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Sunt suscipit similique atque quos veniam consequatur,
tempora quis veritatis aut aspernatur numquam natus voluptatibus, impedit sit. Deleniti commodi sunt eos in
eius,
maxime, quidem enim animi, fugit sit possimus et laudantium dolores ratione recusandae. Tenetur architecto
repellendus non quisquam impedit dolor asperiores optio, et reiciendis dolorum maiores tempore quam. Totam
maiores, mollitia
quasi ab non recusandae sed officia facilis! Non, officia. Sunt expedita voluptate molestiae soluta ratione
deserunt doloribus dolores, nisi obcaecati voluptatibus odio debitis fuga sit nobis consectetur. Doloremque
dolorum iusto
dicta ullam officiis ipsum blanditiis? Soluta similique quas animi hic doloremque neque impedit excepturi quod?
Neque ab ex iusto architecto molestiae ut nemo odit veritatis voluptatum. Ipsam sint reiciendis inventore
exercitationem
odio, ad tempora reprehenderit at voluptatibus quam sit, sequi nisi, placeat cumque minima! Non, iusto. Ratione
quas soluta sequi officia, vel similique ullam deleniti! Consectetur perferendis illo minima debitis id nam iste
reprehenderit dolorum ducimus iusto aliquam autem deserunt pariatur voluptatibus ipsam, officiis quo, sit libero
numquam, nulla explicabo. Id nihil velit autem. Dolorem soluta ipsum quibusdam ex adipisci sit eaque velit sed a
vero
consectetur asperiores dolore suscipit rem voluptatem, maxime exercitationem. Provident harum fugit non, libero,
quisquam ut recusandae esse, iusto suscipit temporibus ad officiis eius velit. Suscipit inventore nam maxime,
eaque,
iste aspernatur obcaecati distinctio earum, aperiam culpa aut molestias porro expedita illum adipisci?
Architecto, culpa quaerat ea consequatur cupiditate, tenetur soluta cumque officiis ab illum aspernatur
praesentium animi
consequuntur velit doloremque! Quos perspiciatis iusto iure minus. In, harum ipsum. Fugit iste vitae obcaecati
nesciunt esse. Iure sunt accusamus assumenda aperiam, sequi vitae optio fugit doloremque harum qui nam dolorum?
Quisquam,
fugit ex. Eos molestias, ex pariatur similique quidem optio in ratione nihil culpa ad tenetur adipisci ipsam
quas explicabo! Velit totam, quis error unde impedit sed corrupti, soluta, nisi iste eaque non molestiae minus
voluptas eos
placeat sequi. Rem, cupiditate esse deserunt quidem accusantium temporibus et recusandae illo consequuntur,
expedita aliquid omnis atque? Placeat tempore doloremque quaerat dolorum autem dolores, eligendi officia odit
modi illum
asperiores quae ut reprehenderit voluptates accusantium ex. Blanditiis praesentium iste, modi vitae ut
reprehenderit dicta accusantium eveniet nostrum perspiciatis facilis accusamus hic optio, tempore laudantium
facere at saepe?
Pariatur similique nostrum mollitia, expedita modi quos rerum numquam suscipit facere maxime eveniet. Labore,
laboriosam soluta magni atque consequatur ipsa sunt id vitae similique ratione nisi architecto, unde ex
consequuntur
magnam accusantium. Natus corporis, amet nemo temporibus laborum quam nulla in sequi quo est corrupti
dignissimos incidunt sint. Tempora eveniet dolores, expedita sequi magnam reiciendis repudiandae optio vel nisi
error minus magni
ratione voluptatum rem suscipit quibusdam ut amet labore voluptas? Quo facere quas dolores culpa laborum iusto
ratione ipsa labore esse delectus praesentium explicabo architecto ullam, maxime cumque quis ipsam officiis
illo. Dolorem
nihil vero expedita consequatur animi ducimus, quos repellendus, aspernatur atque aliquam iusto perferendis
libero mollitia incidunt maxime? Minus consequuntur distinctio explicabo ex excepturi fuga rerum, dolorum
pariatur sequi
minima perferendis aspernatur et, voluptatem doloremque repellendus illum beatae!
</i>
</section>
<div class="slide"></div>
</div>
</body>
</html>