-
Notifications
You must be signed in to change notification settings - Fork 0
/
about.html
216 lines (181 loc) · 12.2 KB
/
about.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
<!DOCTYPE html>
<html>
<head>
<title>Trubotics | VRC 10801Z</title>
<meta charset="utf-8" />
<link rel="shortcut icon" href="icon.ico" type='image/x-icon' />
<link rel="stylesheet" type="text/css" href="main.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<link href="https://fonts.googleapis.com/css?family=Poppins:400,700" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script type="text/javascript" src="main.js"></script>
</head>
<body>
<div class="space">
</div>
<section class="withDoubleMargins" id="upcomming">
<div class="longHorizontal" style="background-image: url('Img/3.jpg'); background-size:cover">
</div>
</section>
<section class="withMainMargins" id="events">
<div class="row">
<div class="col-sm-6">
<div class="sideDiv">
<div class="gradient rectangle"></div>
<h1 class="dark big">About Us</h1>
<p class="addSpacer">The ChangeTheWorld campaign puts the spotlight on direct, effective change in local communities. With this initiative, social enthusiasts aged 14 to 18 are empowered to engage in diverse community events. To date, 181 638 youth from Ontario have given back to the province, over the course of 870 724 remarkable hours.</p>
</div>
</div>
<div class="col-sm-6">
<div class="squareDiv" style="background-image: url('Img/1.jpg'); background-size:cover">
</div>
<div class="sideDiv">
</div>
</div>
</div>
</section>
<section class="withDoubleMargins" id="letter">
<div class="letter">
<div class="letterBody">
<h1 class="dark">Dear Student,</h1>
<p>
The ChangeTheWorld: Ontario Youth Challenge is a program of the Ministry of Citizenship, Immigration and International Trade (MCIIT) that aims to empower youth aged 14 to 18 to be a force for good in their school and /or local community. Now in its ninth year, the ChangeTheWorld challenge will see students from across Ontario be part of a provincial campaign that encourages them to see the value of civic responsibility. They learn that the contributions they make support and strengthen their communities.
<br>
<br> Participation in the campaign is open to all secondary school students across the province and contributes to the 40 community involvement hours required to obtain an Ontario Secondary School Diploma. Students who participate in the campaign have the opportunity to volunteer with their friends and to be part of a larger provincial initiative that demonstrates their contribution to communities in Ontario. We encourage you to engage the students in your school. Throughout Ontario last year, almost 41,400 youth volunteered an astounding 226,982 hours. Let's keep the momentum going.
<br>
<br> ChangeTheWorld also allows secondary students to count volunteer hours from a SpeakUp Project towards the ChangeTheWorld campaign. Since 2008, SpeakUp Project grants from the Ministry of Education's Student Voice initiative have been open to students in grades 7-12 at publicly funded schools. These grants are for student-led projects designed to strengthen student engagement (academically, socially, and intellectually) and have a lasting impact in the school community.
<br>
<br> ChangeTheWorld 2016 kicks off during National Volunteer Week and runs for six weeks from April 10 through to May 22, 2016. ChangeTheWorld is delivered through a partnership with the Ontario Volunteer Centre Network (OVCN) and its 24 local volunteer centres.
</p>
<p>- CTW</p>
</div>
</div>
</section>
<div class="space"></div>
<section class="withDoubleMargins" id="profiles">
<h1>Our Team</h1>
<div class="row">
<div class="col-sm-4">
<div class="square" style="background-image: url('Img/profiles/chevonne.jpg'); background-size:cover">
</div>
<div class="name">
<h2 class="white names" onclick="openModal('Chevonne Chiu','Chair', 'Hello, my name is Chevonne Chiu and I’m the Chair for Change the World Markham. My role is to manage the Leadership Team through monthly meetings, and communicate with them via email. Additionally, I partner with other youth councils to raise awareness for their upcoming events and I help to promote it through Instagram or social media. For the CTW Challenge, I take on the role of planning, communicating, and leading the events which includes the International Women’s Day event, the Amazing Race, or Canada’s 150th Anniversary Celebration.','url(Img/profiles/chevonne.jpg)')">Chevonne Chiu</h2>
</div>
</div>
<div class="col-sm-4">
<div class="square" style="background-image: url('Img/profiles/bobby.jpg'); background-size:cover">
</div>
<div class="name">
<h2 class="white names" onclick="openModal('Bobby Wong','Marketing and PR specialist', 'I create a lot of the promotional material for upcoming volunteering events. I use adobe programs such as after effects, Photoshop, premiere pro, and Light Room to definitively apply my skills in hopes of better inspiring the community youth to take action in volunteering. I also work with the rest of the tech team to help rebrand and reshape CTW Markham. I want to help the youth understand the true importance of volunteering and its not just accumulating hours or resume padding. Volunteering opens a variety of opportunity for growth, network, and education.','url(Img/profiles/bobby.jpg)')">Bobby Wong</h2>
</div>
</div>
<div class="col-sm-4">
<div class="square" style="background-image: url('Img/profiles/jake.jpg'); background-size:cover">
</div>
<div class="name">
<h2 class="white names" onclick="openModal('Jake Xia', 'Web and Branding Specialist', 'I designed and built the website that you are looking at right now! Aside from that, I am working with the rest of the team to build a better brand for Change the World that is more appealing to youth. Using my experience with design and programming, I create the logos, visual language, user interface, graphics, and typography, that will ultimately define us. A common misconception amongst new volunteers is that it is nothing but a 40 hour requirement for graduation. I would like to argue that it is instead a great opportunity to find something you genuinely enjoy and show off your talents. Dedicate those 40 hours to something you care about and it won’t feel like 40 hours at all. ','url(Img/profiles/jake.jpg)')">Jake Xia</h2>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-4">
<div class="square" style="background-image: url('Img/profiles/1.jpg'); background-size:cover">
</div>
<div class="name">
<h2 class="white names" onclick="openModal('Riva Patel', 'Event Coordinator', 'I chose to volunteer for the ChangeTheWorld campaign due to the multitude of opportunities that provide experience from a diversified platform! In particular, I have taken on the role as event coordinator to develop such opportunities for youth to easily sign-up for meaningful and fun events! Volunteering is the best way for me to do something for my community, and it is seen through ChangeTheWorld initiatives how small acts of volunteering have positively impacted those around me. In essence, ChangeTheWorld has helped me realize that no matter the popularity of an event, the number of people present, or the visible significance it has on the community, every act of volunteering means something. ','url(Img/profiles/1.jpg)')">Riva Patel</h2>
</div>
</div>
<div class="col-sm-4">
<div class="square" style="background-image: url('Img/profiles/jessica.jpg'); background-size:cover">
</div>
<div class="name">
<h2 class="white names" onclick="openModal('Jessica Chan', 'Secretary', 'I am a student passionate about volunteering and making a difference in our community. In CTW, I work in correspondence to keep records and carry out ideas. CTW is a great opportunity for me to meet new people and help those in need. I am able to offer students opportunities to not only earn volunteer hours but find the importance of participation and volunteering in their interest. I am also able to prove my abilities and skills to create something valuable and worthwhile. Being in CTW has helped me to work on my teamwork and become a better leader.','url(Img/profiles/jessica.jpg)')">Jessica Chan</h2>
</div>
</div>
</div>
<!--
<div class="col-sm-4">
<div class="square" style="background-image: url('Img/1.jpg'); background-size:cover">
</div>
</div>
</div>
<div class="row">
<div class="col-sm-4">
<div class="square" style="background-image: url('Img/1.jpg'); background-size:cover">
<div class="name">
<h2 class="white">Bobby Wong</h2>
</div>
</div>
</div>
<div class="col-sm-4">
<div class="square" style="background-image: url('Img/1.jpg'); background-size:cover">
</div>
</div>
<div class="col-sm-4">
<div class="square" style="background-image: url('Img/1.jpg'); background-size:cover">
</div>
</div>
</div>
-->
</section>
<div class="space"></div>
<div class="space"></div>
<div class="space"></div>
<footer>
<hr>
<div class="footer">
<h2 class="grey">Change the World<br> Markham</h2>
<ul>
<li><a href="">Home</a></li>
<li><a href="">Events</a></li>
<li><a href="">Story</a></li>
<li><a href="">About</a></li>
<li><a href="">Volunteer</a></li>
<li><a href="">Contact</a></li>
</ul>
</div>
<p class="grey">© copyright 2017 | website designed by Jake X.</p>
</footer>
</body>
<ul class="staticTopnav" id="mytopnav">
<li>
<div class="logo"></div>
</li>
<li><a href="index.html">Home</a></li>
<li><a href="events.html">Events</a></li>
<li><a href="https://ctwmarkham.tumblr.com/" target="_blank">Story</a></li>
<li><a href="about.html">About</a></li>
<li><a href="volunteer.html">Volunteer</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
<hr>
<div id="mySidenav" class="sidenav diagGradient">
<a href="javascript:void(0)" class="closebtn" onclick="closeNav()">×</a>
<a href="index.html">Home</a>
<a href="events.html">Events</a>
<a href="https://ctwmarkham.tumblr.com/" target="_blank">Story</a>
<a href="about.html">About</a>
<a href="volunteer.html">Volunteer</a>
<a href="contact.html">Contact</a>
</div>
<span class="staticHamburger" style="font-size:30px;cursor:pointer" onclick="openNav()">☰</span>
<!-- The Modal -->
<div id="myModal" class="modal">
<!-- Modal content -->
<div class="modal-content">
<div id = "mImg" class="modal-header">
<span id = "close" class="close" onclick="closeModal()">×</span>
</div>
<div class="modal-body">
<h1 id="mhead">Modal Header</h1>
<h4 id = "mdescription">disc</h4>
<p id = "mtext">
Some text here.
<p>
</div>
<!--<div class="modal-footer">
<h3>Modal Footer</h3>
</div>-->
</div>
</div>