-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
118 lines (103 loc) · 6.49 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="styles.css">
<title>Harriton SciOly</title>
<link rel="icon" type="image/x-icon" href="https://github.com/Bitmona/h2s2o/blob/master/400x400.png?raw=true">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
<script src="https://kit.fontawesome.com/ebafefe6ba.js" crossorigin="anonymous"></script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-2Z4Z5172NN"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-2Z4Z5172NN');
</script>
</head>
<body class="bg-light">
<div class="sticky-top shadow collapser bg-light"> <!-- Begin navigation -->
<nav class="navbar bg-light">
<div class="container-fluid bg-light">
<a class="navbar-brand" href="#">
<img src="https://github.com/Bitmona/h2s2o/blob/master/ram.png?raw=true" alt="HHS" width="45" height="30">
<strong>H2S2O</strong>
</a>
<div class="dropdown positon-relative">
<button class="btn" type="button" data-bs-toggle="collapse" data-bs-target="#navbarToggleExternalContent" aria-controls="navbarToggleExternalContent" aria-expanded="false" aria-label="Toggle navigation" type="button" data-bs-toggle="dropdown" aria-expanded="false"><i class="fa-solid fa-bars" style=""></i>
</button>
</div>
</div>
</nav>
<div class="collapse bg-light bg-opacity-50" id="navbarToggleExternalContent" >
<div class="p-4 m-">
<a class="dropdown-item text-center m-2" href="#about">About</a>
<a class="dropdown-item text-center m-2" href="#sponsors">Sponsors</a>
<a class="dropdown-item text-center m-2" href="#events">Events</a>
<a class="dropdown-item text-center m-2" href="#contact">Contact</a>
<!--<a class="dropdown-item text-center m-2" href="#">Archive</a> -->
</div>
</div>
</div> <!-- End navigation -->
<div class="banner container-fluid"> <!-- Begin content -->
<div class="container p-4">
<img src="https://github.com/Bitmona/h2s2o/blob/master/wood.png?raw=true" class="img-fluid mx-auto d-block">
<h1 class="text-center display-1 fw-semibold" style="">Harriton High School Science Olympiad</h1>
<div class="container text-center">
<div class="row row-cols-auto justify-content-center">
<div class="col">
<h5><mark style="background-color:lightcoral; border-radius:5px;">9th</mark> in US</h5>
</div>
<div class="col">
<h5><mark style="background-color:lightcoral; border-radius:5px;">25</mark> time PA Champs</h5>
</div>
</div>
</div>
<h5 class="text-center fw-light">Bryn Mawr, PA</h5>
<hr class="mt-5 mb-5">
<h3 id="about">About</h3> <!-- Add image on right, responsive grid -->
<p class="text-decoration-underline">What is H2S2O?</p>
<ul>
<li>Harriton Science Olympiad <b class="fw-semibold">has no tryouts,</b> which means we don't cut people from our team or finalize our team's members <em>ever.</em> Instead, we have event groups that work together to progress the studying, building, or practicing of each event. </em></li>
<li>This team structure has let us achieve success at the highest levels, winning the Pennsylvania state championship almost every year since 1998. </li>
<li>Our team attracts many students to Harriton from all three of our districts middle schools, many of which who would have normally attended another high school.
</li>
</ul>
<p class="text-decoration-underline">The Competition</p>
<p class="ms-3">Science Olympiad is a nationwide, team-based competition that promotes STEM education through rigorous academic challenges and hands-on events in various scientific disciplines. It encourages collaboration, critical thinking, and problem-solving skills among middle and high school students.</p>
<p class="ms-3 text-muted"><em>See <a class="" href="https://www.soinc.org/events/2025-division-c-events">https://www.soinc.org/events/2025-division-c-events</a> for a current listing and description of the national events.</em></p>
<h3 id="sponsors">Sponsors</h3>
<p class="ms-3">Harriton Science Olympiad is seeking donors and sponsors for the 2024-2025 season. To learn more about supporting our team, please contact us at <a href="mailto:contact@harritonscioly.com" class=""> contact@harritonscioly.com</a>.</p>
<p class="ms-3 text-muted"><em><a href="/sponsor-letter.pdf" type="application/pdf" target=”_blank”>Sponsor Letter</a> (PDF)</em></p>
<h3 id="events">Events</h3>
<ul>
<li>Summer Meet-up: End of August</li>
<li>Initial meeting: Mid-September</li>
<li>Invitational timeline TBD</li>
</ul>
<hr class="mt-5 mb-5">
<h3 id="contact">Contact Us</h3>
<p class="">Questions? Concerns? <br> Send us an email at <a href="mailto:contact@harritonscioly.com" class=""> contact@harritonscioly.com</a></p>
</div>
</div> <!-- End content -->
<div class="container bg-light"> <!-- start footer -->
<footer class="d-flex flex-wrap justify-content-between align-items-center py-1 my-4 bg-light">
<div class="col-md-2 d-flex align-items-center bg-light">
<a href="https://pascioly.org" class="mb-1 me-2 mb-md-0 text-body-secondary text-decoration-none lh-1">
<img class="bi" width="86" height="50" src="https://github.com/Bitmona/h2s2o/blob/master/PASO_Logo_1db.png?raw=true">
</a>
</div>
<div class="col d-flex justify-content-center align-items-center bg-light">
<span class="mb-0 mb-md-0 bg-light">Copyright © 2024 Harriton Science Olympiad</span>
</div>
<ul class="nav col-md-2 justify-content-end list-unstyled d-flex">
<li class="ms-3"><a class="text-body-secondary" href="https://www.instagram.com/harriton.scioly/"><i class="fs-2 fa-brands fa-instagram"></i></a></li>
</ul>
</footer>
</div> <!-- end footer -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz" crossorigin="anonymous"></script>
</body>
</html>