-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.html
226 lines (209 loc) · 11.7 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
222
223
224
225
226
<!DOCTYPE html>
<html lang="en">
<head>
<title>Join TEC!</title>
<meta charset="UTF-8">
<meta name="author" content="Arona Jones">
<meta name="description" content="How to join TEC PA & Lighting and loads of reasons you should!">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
<meta property="og:image" content="https://join.nottinghamtec.co.uk/static/images/tec_logo_full.png">
<meta property="og:description" content="How to join TEC PA & Lighting and loads of reasons you should!">
<meta property="og:url" content="https://join.nottinghamtec.co.uk">
<meta property="og:title" content="Join TEC!">
<link rel="apple-touch-icon" sizes="57x57" href="static/favicons/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="static/favicons/apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="static/favicons/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="static/favicons/apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="static/favicons/apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="static/favicons/apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="static/favicons/apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="static/favicons/apple-touch-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="static/favicons/apple-touch-icon-180x180.png">
<link rel="icon" type="image/png" href="static/favicons/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="static/favicons/android-chrome-192x192.png" sizes="192x192">
<link rel="icon" type="image/png" href="static/favicons/favicon-96x96.png" sizes="96x96">
<link rel="icon" type="image/png" href="static/favicons/favicon-16x16.png" sizes="16x16">
<link rel="manifest" href="static/favicons/manifest.json">
<link rel="mask-icon" href="static/favicons/safari-pinned-tab.svg" color="#3853a4">
<link rel="shortcut icon" href="static/favicons/favicon.ico">
<meta name="msapplication-TileColor" content="#2b5797">
<meta name="msapplication-TileImage" content="static/favicons/mstile-144x144.png">
<meta name="msapplication-config" content="static/favicons/browserconfig.xml">
<meta name="theme-color" content="#333333">
<link rel="stylesheet" href="main.css">
<link rel="stylesheet" href="popup.css">
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous" defer>
</head>
<body>
<div id="maincontent">
<header>
<div id="header-background" class="floating" style="display: flex; flex-wrap: nowrap; justify-content: center">
<div class="header-text">
<h1>Get Involved with Something Unique!</h1>
<h2 style="margin-top: 0.2em; padding-bottom: 0.5em; padding-left: 1em;"><em>By students, for students</em></h2>
</div>
<div class="no-mobile" style="margin-left: auto; margin-top: auto; margin-bottom: auto; margin-right: 2em;">
<img src="static/images/tec_logo_white.png" id="headerlogo" style="height: 120px; width: auto">
</div>
</div>
</header>
<main>
<div class="container">
<div style="padding-top: .5em; padding-bottom: 0.5em; grid-area: head; background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url('static/images/gb.jpg'); background-position: center; background-repeat: no-repeat; background-size: cover; width: 100vw; position: relative;
left: 50%;
right: 50%;
margin-left: -50vw;
margin-right: -50vw;">
<div style="max-width: 70%; margin: auto;">
<p>
TEC is an UoNSU Student Group providing technical services within the University to the Union and other Student Groups. We also work with external clients. Our team work on a range of events, from Graduation Ball to student comedy nights. We own, maintain and operate all of our lighting, sound and AV equipment.
</p>
<p>
TEC involves a wide variety of activities:
</p>
<ul>
<li>Setting up and running events of all kinds</li>
<li>Honing technical skills during training sessions</li>
<li>Communicating with clients and planning events</li>
<li>Maintaining our equipment</li>
<li>Driving our van</li>
</ul>
<h3><em>You</em> can be one of the volunteers making it continue year on year!</h3>
</div>
<div id="signup" style="margin-top: 5em;">
<div style="text-align: center;">
<button type="button" style="background: #078148; border-top: 3em">
<a href="https://www.su.nottingham.ac.uk/student-media-groups/tec/">Sign Up!</a>
</button>
</div>
<p>It's free and always will be.</p>
<p style="color: gray">
This'll take you to the SU website (you'll need to sign in there) where you can add a membership to TEC.
</p>
</div>
</div>
<div style="grid-area: testemonial">
<h2 class="header">Why join TEC? Simple.</h2>
<p>Our members say:</p>
<div id="testemonial-grid">
<img src="static/images/liv.jpg" style="width:5em; border-radius: 50%;">
<div class="blue floating testemonial-quote">
<h3>"TEC allowed me to really engage with student life, I have made lifelong friendships and unforgettable memories." — Liv</h3>
</div>
<img src="static/images/jess.jpg" class="headshot">
<div class="blue floating testemonial-quote">
<h3>"Coolest group I've joined" — Jess </h3>
</div>
<img src="static/images/mattsface.jpeg" class="headshot">
<div class="blue floating testemonial-quote">
<h3>"Running events in our team gives me a sense of pride like nothing else" — Matt </h3>
</div>
</div>
</div>
<div id="nmi" style="grid-area: nmi">
<h2 class="header">New Members' Introduction</h2>
<p>TEC is all about getting stuck in — why not come along to a New Members' Introduction? We'll introduce you to some of our kit and how to use it. No experience is required and once you’ve attended, you can come along to any TEC event.</p>
<div class="nmi-location">
<h3 style="text-align:center;font-size:20px;">Tuesday 8th October @ 19:00 in The Welcome Zone, Portland Building</h3>
</div>
<div class="nmi-location" style="margin-top: 15px;">
<h3 style="text-align:center;font-size:20px;">Saturday 6th October @ 13:00 in The Welcome Zone, Portland Building</h3>
</div>
</div>
<div style="grid-area: benefits">
<h2 class="header">What can I get from TEC?</h2>
<img id="socialimg" src="static/images/wa.jpg" class="floating">
<p>We learn how to maintain and operate equipment to a high standard. You'll acquire skills and experience which look excellent on a CV. Take it from any number of our members who are employed in the events industry! TEC provides an unparalleled opportunity for networking with fellow teccies and clients alike. You'll make friends, not just work with colleagues. Most of all, it's great fun!</p>
</div>
<div style="grid-area: socials">
<h2 class="header">Socials</h2>
<img id="socialimg" src="static/images/social.jpg" class="floating">
<p>Running events may be what we do but we also enjoy kicking back and relaxing. We're often found in the pub enjoying our 'crew food' — TEC provides food for its members on or after events. We also hold other socials such as Go-Ape, bowling and go-karting, usually paid for by TEC.</p>
</div>
<div style="grid-area: moose">
<!--- Mynd you, møøse bites Kan be pretti nasti... --->
<h2 class="header" style="grid-area: moose">What's with the moose?</h2>
<div style="display: flex; flex-direction: row;" id="moose">
<img id="moose" src="static/images/poster.png" style="width: 500px; margin: 1em;" style="grid-area: mooseimg">
<p style="grid-area: moosetext">The moose is TEC's mascot, seen here doing a rather good impression of Lord Kitchener to help us out with recruitment. Previously guardian of our van he has since been promoted to watch over our office in the Portland Building. The storeroom guarding job was already covered by a duck. (Yes, we know we're a bit odd. Promise the moose doesn't bite) Come by and say hi sometime! Or email him at [email protected]...</p>
</div>
</div>
</div>
</main>
<footer>
<div style="text-align: left; padding-left: 0.5em; padding-right: 0.5em; box-shadow: 0 8px 6px -6px black;"
class="blue">
<h2 style="text-align: center; width: 100%; padding-top: 0.5em; padding-bottom: 0px; margin-bottom: 0px" class="no-desktop">Find us:</h2>
<div id="contact">
<h2 class="no-mobile">Find us:</h2>
<h2><a href="mailto:[email protected]"><i class="fas fa-envelope"></i></a></h2>
<h2><a href="https://facebook.com/nottinghamtec"><i class="fab fa-facebook"></i></a>
</h2>
<h2><a href="https://twitter.com/nottinghamtec"><i class="fab fa-twitter"></i></a>
</h2>
<h2><a href="https://instagram.com/nottinghamtec"><i class="fab fa-instagram"></i></a>
</h2>
<h2><a class="no-decor" href="tel:01158468720"><i class="fas fa-phone"></i><span class="no-mobile">
<u>0115 846 8720</u></span></a></h2>
</div>
</div>
<div
style="background-image: url('static/images/background.jpg'); background-size: cover; padding-top: 0.5em; padding-bottom: 0.5em">
<div style="display: flex">
<div>
<img src="static/images/tec_logo_white.png" style="width:7em; height: auto; padding: 0.5em; object-fit: contain"
alt="TEC Logo, 'TEC' in serif with 'PA and Lighting' in a blue box surrounded by rings">
</div>
<div>
<i class="fas fa-user" style="padding-bottom: 0.5em"> </i> <a
href="https://members.nottinghamtec.co.uk">Members' Login</a>
<br>
<i class="fas fa-globe"> </i> <a href="https://nottinghamtec.co.uk">Main Website</a>
</div>
</div>
</div>
</footer>
</div>
<!-- for popup (uncomment code to enable)
<div id="overlay"></div>
<div id="popupouter">
<div id="popup" class="floating">
<div class="popupcontent">
<h1 class="header">
Welcome Week 2023
</h1>
<h2>
You can find us at the following welcome events:
</h2>
<ul>
<li>25/09/2023 10am till 4pm - Welcome fair at David Ross Sports Village</li>
<li>26/09/2023 10am till 4pm - Welcome fair at David Ross Sports Village</li>
<li>27/09/2023 1pm till 4pm - Sutton Bonington welcome fair in the SB sports centre</li>
</ul>
<h2>
Feel free to come by, get some free stuff, ask any questions and find out how to get involved!
</h2>
<div id= "popupclose" class="popupcontrols floating">
<span>Close</span>
</div>
</div>
</div>
</div>
<script type="text/javascript">
// Initialize Variables
var closePopup = document.getElementById("popupclose");
var overlay = document.getElementById("overlay");
var popup = document.getElementById("popup");
var popupouter = document.getElementById("popupouter");
// Close Popup Event
closePopup.onclick = function() {
overlay.style.display = 'none';
popup.style.display = 'none';
popupouter.style.display = 'none';
};
</script>
end of pop up section -->
</body>
</html>