-
Notifications
You must be signed in to change notification settings - Fork 3
/
activities.html
167 lines (134 loc) · 10.6 KB
/
activities.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
<!DOCTYPE html>
<html class="scroll-smooth">
<head>
<meta charset="utf-8" />
<title>Ensemble</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./responsive.css"></link>
<link href="./output.css" rel="stylesheet">
<link rel="icon" href=
"./img/croped logo-removebg.png"
type="image/x-icon">
</head>
<body class="">
<header id="header" class="bg-black text-blue-400 text-sm h-14 absolute w-full flex flex-row items-center justify-between px-8 border-b border-white overflow-visible">
<div class="text-2xl text-white font-semibold">ENSEMBLE</div>
<nav id="nav" class=" flex flex-row gap-12 p-5">
<a class="hover:text-white hover:scale-110 ease-in-out font-semibold" href="index.html">HOME</a>
<a class="hover:text-white hover:scale-110 ease-in-out font-semibold" href="gallery.html">GALLERY</a>
<a class="hover:text-white hover:scale-110 ease-in-out font-semibold" href="team.html">TEAM</a>
<div id="activities_nav" class="relative ">
<a class="hover:text-white hover:scale-110 ease-in-out font-semibold" href="activities.html">ACTIVITIES</a>
<div id="activities_show" class="hidden absolute flex flex-col bg-black p-4 w-[200px] border border-white translate-x-[-50px]">
<a class="hover:text-white hover:scale-110 ease-in-out font-semibold p-2 ease-in-out" href="talk.html">Talk and Resources</a>
<a class="hover:text-white hover:scale-110 ease-in-out font-semibold p-2 ease-in-out" href="schedule.html">Schedule of upcoming events</a>
<a class="hover:text-white hover:scale-110 ease-in-out font-semibold p-2 ease-in-out" href="lecture.html">Lecture series 2024 </a>
</div>
</div>
<a class="hover:text-white hover:scale-110 ease-in-out font-semibold" href="contact.html">CONTACT</a>
</nav>
<div id="nav-icon" class="w-[20px] hidden flex-col gap-[0.25rem] relative ">
<span class="border-b border-white w-[20px] border-[2px] "></span>
<span class="border-b border-white w-[20px] border-[2px] "></span>
<span class="border-b border-white w-[20px] border-[2px] "></span>
</div>
</header>
<div class="mobile_nav hidden h-screen w-screen bg-black pt-[50px] text-white flex flex-col justify-center items-center text-center transition ease-in-out">
<a class="hover:text-white hover:scale-110 ease-in-out font-semibold w-screen p-5 " href="index.html">HOME</a>
<a class="hover:text-white hover:scale-110 ease-in-out font-semibold w-screen p-5" href="gallery.html">GALLERY</a>
<a class="hover:text-white hover:scale-110 ease-in-out font-semibold w-screen p-5" href="team.html">TEAM</a>
<a class="hover:text-white hover:scale-110 ease-in-out font-semibold w-screen p-5" href="activities.html">ACTIVITIES</a>
<a class="hover:text-white hover:scale-110 ease-in-out font-semibold w-screen p-5" href="contact.html">CONTACT</a>
</div>
<section id="main" style="background-image: url(./img/bg.jpg);" class="bg-cover bg-fixed py-8">
<section class=" flex py-[20vh] pb-4 justify-center items-center justify-center items-center">
<div class="bg-black border-y border-white h-full flex flex-col items-center justify-center py-16 w-[80vw] ">
<p class="text-white text-4xl text-center p-8 font-semibold" >Activities</p>
<div class="activities-list text-white p-8 pb-4 w-[80vw]">
<div class="activity mb-8">
<h2 class="text-2xl md:text-3xl lg:text-4xl font-semibold mb-2">Exordium Series</h2>
<p class="text-lg md:text-xl mb-4">
This is an introductory-level talk series aimed at mainly first and second year undergraduates. The purpose of these talks is to expose the participants to the various exciting fields of physics and allow them to explore different avenues, which include but are not limited to condensed matter, high energy physics, and astrophysics. Most of these talks are given by undergraduate students and science communicators, and provide a simplified, broad view of the field.
</p>
<p class="text-lg md:text-xl">
These talks require the bare-minimum prerequisites to participate and are designed specifically for freshman physics students.
</p>
</div>
<div class="activity mb-8">
<h2 class="text-2xl md:text-3xl lg:text-4xl font-semibold mb-2">Venture Series</h2>
<p class="text-lg md:text-xl mb-4">
This is a more advanced-level talk series aimed at students who are more familiar with the introductory material and have a basic understanding of the prerequisites. The purpose of these talks is to allow participants to delve deeper into the field that interests them and to allow them to learn from and interact with the who's who of the field. These talks are given by research students and expert professors in the field, and provide a more thorough presentation of a specific topic in physics.
</p>
<p class="text-lg md:text-xl">
These talks require some prerequisites depending on the subject of the talk, and are designed for more senior physics students (second and third year students).
</p>
</div>
<div class="activity mb-8">
<h2 class="text-2xl md:text-3xl lg:text-4xl font-semibold mb-2">Collaboration with IAP</h2>
<p class="text-lg md:text-xl">
Institute of Applied Physics (IAP) will be organizing a series of talks on alternate careers in Science, designed to highlight experts who did not pursue research but went on to distinguish themselves in non-research careers in Science such as industry, journalism, and policy. These talks provide a crucial perspective which comes in handy while making key career decisions. Ensemble has partnered with IAP to encourage the UG student population to participate in these key talks.
</p>
</div>
<div class="activity mb-8">
<h2 class="text-2xl md:text-3xl lg:text-4xl font-semibold mb-2 ">Also check out</h2>
<ul>
<li><a class="text-blue-500 hover:underline text-xl" href="talk.html">Talk and Resources</a></li>
<li><a class="text-blue-500 hover:underline text-xl" href="schedule.html">Schedule of upcoming events</a></li>
<li><a class="text-blue-500 hover:underline text-xl" href="lecture.html">Lecture series 2024 </a></li>
</ul>
</div>
</div>
</div>
</section>
<section id="Newsletter_container" class="h-[50vh] flex flex-col justify-center items-center text-white gap-10 n">
<p id="NewsLetter_Head" class="text-5xl mb-4 w-[75vw] ">Join our mailing list for updates on events and for receiving our newsletter!</p>
<form id="newsletter_form" class="flex items-center justify-between" method="POST" action="https://script.google.com/macros/s/AKfycbwyp1XfGOxn_SnPrTdRwyn2JoWxqadV00YryjxlhmRLyYNLpkcEGzzhHUFmf019_KYl0w/exec">
<input type="email" placeholder="Enter your email" name="Email_for_newsletter" class="px-4 py-2 w-[60vw] h-[50px] border text-black border-white focus:outline-2 focus:outline-blue-600">
<button type="submit" class=" w-[15vw] text-white border border-white hover:bg-blue-800 h-[50px] text-[1.5vw] focus:outline-none">JOIN US</button>
</from>
</section>
</section>
<footer class="h-[50vh] border-t border-white bg-black ">
<div class="flex flex-row justify-around items-center text-white h-full">
<img src="./img/iisc white.png" alt="" class=" footer_img h-72">
<div id="footer_links" class="text-center">
<p id="footer_Institute" class="p-3 border-b border-white text-2xl">INDIAN INSTITUTE OF SCIENCE - BANGALORE</p>
<p id="Conatact_mail" class="text-xl p-3 mb-10">[email protected]</p>
<div id="Social_media_links_container">
<div class="grid grid-cols-2 gap-10">
<a href="#" class="flex items-center justify-between w-[18vw]">
<img src="./img/facebook_logo.png" class="w-12 h-12">
<span class=" flex flex-row gap-2 items-center">
<span class="bg-white h-2 w-2 rounded-full"></span>
<p>ensemble.facebook</p>
</span>
</a>
<a href="https://www.instagram.com/ensemble.iisc/?hl=en" class="flex items-center justify-between w-[18vw]">
<img src="./img/instagram_logo.png" class="w-12 h-12">
<span class=" flex flex-row gap-2 items-center">
<span class="bg-white h-2 w-2 rounded-full"></span>
<p>ensemble.instagram</p>
</span>
</a>
<a href="#" class="flex items-center justify-between w-[18vw]">
<img src="./img/linkedIn_logo.png" class="w-12 h-12">
<span class=" flex flex-row gap-2 items-center">
<span class="bg-white h-2 w-2 rounded-full"></span>
<p>ensemble.LinkedIn</p>
</span>
</a>
<a href="#" class="flex items-center justify-between w-[18vw]">
<img src="./img/youtube_logo.png" class="w-12 h-12">
<span class=" flex flex-row gap-2 items-center">
<span class="bg-white h-2 w-2 rounded-full"></span>
<p>ensemble.youtube</p>
</span>
</a>
</div>
</div>
</div>
</div>
</footer>
<script src="main.js"></script>
</body>
</html>