-
Notifications
You must be signed in to change notification settings - Fork 3
/
index.html
623 lines (619 loc) · 24 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
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
<!DOCTYPE html>
<html
data-wf-site="55f727fc81c0c2a86eeb2c2c"
data-wf-page="569d31f937974db555b2f05f"
>
<head>
<meta charset="utf-8" />
<title>Caronaê - Aplicativo de Caronas</title>
<meta
name="description"
content="Encontre e ofereça caronas para ir e voltar da sua universidade"
/>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" type="text/css" href="css/normalize.css" />
<link rel="stylesheet" type="text/css" href="css/webflow.css" />
<link rel="stylesheet" type="text/css" href="css/caronae.css" />
<link rel="image_src" href="images/caronae-logo.png" />
<script src="https://ajax.googleapis.com/ajax/libs/webfont/1.4.7/webfont.js"></script>
<script>
WebFont.load({
google: {
families: ["Montserrat:400,700", "Varela:400"],
},
});
</script>
<script type="text/javascript" src="js/modernizr.js"></script>
<link rel="shortcut icon" type="image/x-icon" href="images/icon.jpg" />
<link rel="apple-touch-icon" href="images/icon.jpg" />
<style>
.pergunta-title {
cursor: pointer;
}
</style>
<script>
(function (i, s, o, g, r, a, m) {
i["GoogleAnalyticsObject"] = r;
(i[r] =
i[r] ||
function () {
(i[r].q = i[r].q || []).push(arguments);
}),
(i[r].l = 1 * new Date());
(a = s.createElement(o)), (m = s.getElementsByTagName(o)[0]);
a.async = 1;
a.src = g;
m.parentNode.insertBefore(a, m);
})(
window,
document,
"script",
"https://www.google-analytics.com/analytics.js",
"ga"
);
ga("create", "UA-97867968-1", "auto");
ga("send", "pageview");
</script>
</head>
<body class="landing-page">
<div
data-collapse="medium"
data-animation="over-right"
data-duration="400"
data-contain="1"
class="w-nav header"
>
<div class="w-row lines-container">
<div
class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line brown"
></div>
<div
class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line blue"
></div>
<div
class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line pink"
></div>
<div
class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line green"
></div>
<div
class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line orange"
></div>
<div
class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line red"
></div>
</div>
<div class="w-container">
<a href="index.html#top" class="w-nav-brand logo">
<img src="images/caronae-logo.png" />
</a>
<nav role="navigation" class="w-nav-menu side-menu">
<a href="#top" class="w-nav-link nav-link">Aplicativo</a>
<a href="#vantagens" class="w-nav-link nav-link">Vantagens</a>
<a href="#como-usar" class="w-nav-link nav-link">Como usar</a>
<a href="#quem-faz" class="w-nav-link nav-link">Quem faz</a>
<a href="#contato" class="w-nav-link nav-link">Falaê</a>
<a href="faq.html" class="w-nav-link nav-link">FAQ</a>
<a href="termos-de-uso.html" class="w-nav-link nav-link"
>Termos de Uso</a
>
</nav>
<div class="w-nav-button">
<div class="w-icon-nav-menu"></div>
</div>
</div>
</div>
<!-- Aplicativo -->
<section id="top" class="w-section destaque">
<div class="w-row absolute-bottom">
<div class="w-col w-col-6 w-col-small-6 w-hidden-tiny mockup"></div>
<div class="w-col w-col-6 w-col-small-6 texto">
<h1 class="margin-bottom-small">Vai uma Caronaê?</h1>
<p class="margin-botton-medium">
O Caronaê é uma iniciativa concebida, desenvolvida e
operacionalizada por discentes da UFRJ - Universidade Federal do Rio
de Janeiro. Lançado em 2016, trata-se de um sistema de caronas
compartilhadas seguro e prático direcionado, inicialmente, à
comunidade acadêmica. Com mais de 70 mil caronas registradas, o
aplicativo Caronaê esteve no ar até março de 2020, quando, por conta
da pandemia de COVID-19, houve uma drástica redução de deslocamentos
e inativação do aplicativo.
<br />
<br />Contemplado com nota máxima no edital de Projetos Especiais do
Parque Tecnológico da UFRJ, o retorno e a implementação do
aplicativo não será mais restrito à comunidade acadêmica,
abrangendo, agora, as empresas interessadas que fazem parte do
Parque Tecnológico.
<br />
<br />O momento atual do projeto é de reestruturação e preparação
para um futuro relançamento, se posicionando para além de ser um
aplicativo de caronas, mas também uma iniciativa capaz de contribuir
com dados e conhecimento para o debate de mobilidade sustentável e
gerenciamento da mobilidade.
<!-- <br>Curtiu? Então baixaê, é grátis!</p>
<div class="w-row disponivel-labels">
<div class="w-col w-col-6 w-col-small-6 w-col-tiny-6">
<a href="//itunes.apple.com/us/app/caronae-ufrj/id1078790049?ls=1&mt=8" target="_blank">
<img src="images/stores/app-store-badge.png" class="download-label">
</a>
</div>
<div class="w-col w-col-6 w-col-small-6 w-col-tiny-6">
<a href="//play.google.com/store/apps/details?id=br.ufrj.caronae" target="_blank">
<img src="images/stores/google-play-badge.png" class="download-label">
</a>
</div>
</div>
<a href="termos-de-uso.html" class="termos-compromisso">Veja os Termos de Uso</a> -->
</p>
</div>
</div>
</section>
<div class="w-row lines-container">
<div
class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line brown"
></div>
<div
class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line blue"
></div>
<div
class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line pink"
></div>
<div
class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line green"
></div>
<div
class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line orange"
></div>
<div
class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line red"
></div>
</div>
<div class="w-section apoiadores">
<h2 class="apoiadores-title">
<strong data-new-link="true">Apoiadores:</strong>
</h2>
<div class="w-row row-apoiadores">
<div class="w-col w-col-1 apoiador apoiador-1">
<a href="//www.ufrj.br/" target="_blank">
<img src="images/supporters/logo-ufrj.png" class="apoio-ufrj" />
</a>
</div>
<div class="w-col w-col-1 apoiador">
<a href="//fundoverde.ufrj.br/index.php/pt/" target="_blank">
<img src="images/supporters/logo-fv.jpg" class="apoio-ufrj" />
</a>
</div>
<div class="w-col w-col-1 apoiador apoiador-1">
<a href="//ibts.eco.br/" target="_blank">
<img src="images/supporters/logo-ibts.jpg" class="apoio-ufrj" />
</a>
</div>
<div class="w-col w-col-1 apoiador">
<a href="//ic.ufrj.br/" target="_blank">
<img src="images/supporters/logo-ic.jpg" class="apoio-ufrj" />
</a>
</div>
<div class="w-col w-col-1 apoiador apoiador-1">
<a href="//parque.ufrj.br" target="_blank">
<img src="images/supporters/logo-pqtec.png" class="apoio-ufrj" />
</a>
</div>
<div class="w-col w-col-1 apoiador">
<a href="//www.prefeitura.ufrj.br/index.php/pt/" target="_blank">
<img src="images/supporters/logo-prefeitura.jpg" />
</a>
</div>
<div class="w-col w-col-1 apoiador">
<a href="//www.inovacao.ufrj.br/" target="_blank">
<img
src="images/supporters/agenciaufrjdeinovacao.png"
class="apoio-ufrj"
/>
</a>
</div>
</div>
</div>
<div class="w-row lines-container">
<div
class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line brown"
></div>
<div
class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line blue"
></div>
<div
class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line pink"
></div>
<div
class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line green"
></div>
<div
class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line orange"
></div>
<div
class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line red"
></div>
</div>
<section id="sobre" class="w-section about">
<div class="container short">
<div class="sobre-head">
<h2 class="sobre-heading">
O objetivo é juntar, de maneira simples e prática, todas as ofertas
de carona em uma única plataforma.
</h2>
</div>
<p class="sobre-p">
De 2014 até 2020, unimos o mundo real e o virtual:
</p>
<div class="w-row short">
<div class="w-col w-col-6 w-col-small-6 w-col-tiny-6">
<div>
<a href="#mapa" class="w-inline-block">
<img
src="images/icone-pontos-de-carona.png"
class="icon carona"
/>
</a>
<p class="sobre-label">
<strong class="subheading-font sobre">Pontos de carona</strong>
<br />
<br />Locais para encontro entre motoristas e caronistas
</p>
</div>
</div>
<div class="w-col w-col-6 w-col-small-6 w-col-tiny-6">
<div>
<a href="#vantagens" class="w-inline-block">
<img src="images/icon.jpg" class="icon" />
</a>
<p class="sobre-label">
<strong class="subheading-font sobre">Aplicativo</strong>
<br />
<br />Android e iOS
</p>
</div>
</div>
</div>
<div class="missao">
<h2 class="sobre-heading">A Razão por trás disso tudo</h2>
<p class="razao-p">
O Caronaê acredita que a mudança de cultura é a chave para um mundo
melhor. Identificamos que hoje em dia, uma das maiores causas dos
problemas da vida urbana é a falta de colaboração entre as pessoas.
</p>
<p class="razao-p">
Portanto, mais do que facilitar a vida de cada indivíduo, o Caronaê
é movido pela vontade de impactar positivamente a vida de todos,
como comunidade. É conectando pessoas e restabelecendo o espírito de
confiança que o Caronaê se propõe a colaborar com a transformação
cultural.
</p>
<p class="razao-p">
Buscando atingir cada vez mais instituições, promover mais caronas,
e influenciar positivamente no deslocamento diário de mais pessoas,
o Caronaê tomou a iniciativa de abrir seu código, tornando-o
disponível publicamente através do
<a href="https://github.com/caronae" target="_blank">GitHub</a>. A
replicação do sistema de código aberto tem como principal intenção
criar uma rede colaborativa para difusão e aprimoramento do sistema
de caronas em todo o país.
</p>
</div>
</div>
</section>
<!-- Vantagens -->
<section id="vantagens" class="w-section conheca-vantagens">
<h2 class="big-title">Conheça as vantagens</h2>
<div class="w-row block-row">
<div class="w-col w-col-4 block brown">
<h3 class="vantagens-heading">Segurança</h3>
<p class="vantagens-p">
Uso exclusivo para a comunidade acadêmica das instituições
integrantes da Rede Caronaê, evitando a presença de usuários
desconhecidos.
</p>
</div>
<div class="w-col w-col-4 block blue">
<h3 class="vantagens-heading">Tempo</h3>
<p class="vantagens-p">
As caronas reduzem significativamente o tempo gasto com a locomoção
até a sua instituição, sobrando tempo para o que realmente importa.
</p>
</div>
<div class="w-col w-col-4 block pink">
<h3 class="vantagens-heading">Centralização</h3>
<p class="vantagens-p">
Unifica as ofertas de carona em uma plataforma única, aumentando as
oportunidades de viagens compartilhadas.
</p>
</div>
</div>
<div class="w-row block-row">
<div class="w-col w-col-4 block green">
<h3 class="vantagens-heading">Meio Ambiente</h3>
<p class="vantagens-p">
Aumentando a taxa média de ocupação dos veículos, reduzimos o número
de carros nas ruas e, com isso, a emissão de poluentes.
</p>
</div>
<div class="w-col w-col-4 block orange">
<h3 class="vantagens-heading">Integração</h3>
<p class="vantagens-p">
Em caronas, já surgiram grandes amizades, ideias mirabolantes e
acordos milionários. Conte sua história para a gente!
</p>
</div>
<div class="w-col w-col-4 block red">
<h3 class="vantagens-heading">Pontos de Carona</h3>
<p class="vantagens-p">
Bem sinalizados, entre os prédios e os estacionamentos, eles
facilitam o encontro entre os motoristas e os caronistas do Caronaê.
</p>
</div>
</div>
</section>
<!-- Como usar -->
<section id="como-usar" class="w-section acesso">
<h2 class="big-title">Como usar</h2>
<h2 class="sobre-p" style="color: red">
⚠️ Em breve as imagens serão atualizadas para o novo aplicativo.
</h2>
<div>
<div
data-animation="slide"
data-duration="500"
data-infinite="1"
class="w-slider slider"
>
<div class="w-slider-mask">
<div class="w-slide slide">
<img src="images/how-to/slide0.jpg" class="slide-img" />
</div>
<div class="w-slide slide">
<img src="images/how-to/slide1.jpg" class="slide-img" />
</div>
<div class="w-slide slide">
<img src="images/how-to/slide2.jpg" class="slide-img" />
</div>
<div class="w-slide slide">
<img src="images/how-to/slide3.jpg" class="slide-img" />
</div>
</div>
<div class="w-slider-arrow-left">
<div class="w-icon-slider-left arrow"></div>
</div>
<div class="w-slider-arrow-right">
<div class="w-icon-slider-right arrow"></div>
</div>
<div
class="w-slider-nav w-slider-nav-invert w-round slider-nav"
></div>
</div>
</div>
</section>
<div id="mapa" class="mapa">
<h2 class="big-title big-margin-top">
Pontos de carona na UFRJ utilizados de 2014 até 2020
</h2>
<div data-ix="click-hide" class="overlap"></div>
<div class="w-embed w-iframe mapa">
<iframe
src="https://www.google.com/maps/d/embed?mid=1VIfeFWH_ByFz4P3KqwNAU7BgXgw"
width="100%"
height="540"
></iframe>
</div>
</div>
<!-- Quem faz -->
<section id="quem-faz" class="w-section quem-faz">
<h2 class="title-font margin-bottom-small big-title">
Quem faz o Caronaê?
</h2>
<p class="quem-faz-p">
Insatisfeitos com a dificuldade em chegar na faculdade, nos juntamos
para solucionar este problema que não é de hoje - e que já foi pior.
</p>
<p class="quem-faz-p">
A Rede Caronaê é composta por todas as instituições que tenham interesse
em utilizar o código e implementar o Caronaê em sua instituição, podendo
ser adaptado à realidade particular de cada comunidade acadêmica e
contribuindo para um sistema mais amplo, eficaz e confiável.
</p>
<p class="quem-faz-p">
Sabemos como a banda toca. Somos alunos, funcionários e professores que
buscam melhorar o ambiente acadêmico através da carona solidária, unindo
pessoas e estimulando o desenvolvimento sustentável. Muito prazer, Rede
Caronaê:
</p>
<script type="text/javascript" src="js/team-members.js"></script>
<script>
createTeamMembers([
[
"Maria Luiza Machado Campos",
"team-mluiza.jpeg",
"Professora IC/UFRJ",
"http://lattes.cnpq.br/0659658820912418",
"Coordenação",
],
[
"Nathan Andrade",
"team-na.jpg",
"Graduando em Ciência da Computação",
"https://www.linkedin.com/in/nathanandrade/",
"Gestão e Desenvolvimento",
],
[
"Breno Kern",
"team-breno.png",
"Graduando em Ciência da Computação",
"https://www.linkedin.com/in/breno-kern-43a402235/",
"Desenvolvimento",
],
[
"Fernando Giongo",
"team-fernando.png",
"Graduando em Ciência da Computação",
"http://linkedin.com/in/fernandogiongo",
"Desenvolvimento",
],
[
"Gabriela Freitas",
"team-gabi.png",
"Graduanda em Licenciatura em Expressão Gráfica",
"http://linkedin.com/in/gabriela-freitas-b60968237/",
"Design",
],
[
"Henrique Lima",
"team-avatar.png",
"Graduando em Ciência da Computação",
null,
"Dados",
],
[
"Iago Rafael Lucas Martins",
"team-iago.png",
"Graduando em Ciência da Computação",
"http://linkedin.com/in/iagorafaellm/",
"Design",
],
[
"João Pedro Cavalcante",
"team-jpc.png",
"Graduando em Ciência da Computação",
"https://www.linkedin.com/in/jo%C3%A3o-pedro-silva-8277b31bb/",
"Desenvolvimento",
],
[
"Leonardo Moreira",
"team-leo.png",
"Graduando em Ciência da Computação",
"http://linkedin.com/in/leonardo-moreira-740432123/",
"Desenvolvimento",
],
[
"Letícia Jandres",
"team-let.png",
"Graduanda em Comunicação Visual Design",
"http://linkedin.com/in/let%C3%ADcia-jandres-b49766225/",
"Design",
],
[
"Lucas Tsai",
"team-tsai.png",
"Graduando em Ciência da Computação",
"http://linkedin.com/in/lucas-tsai-tong-shin/",
"Desenvolvimento",
],
[
"Mellanie Pereira",
"team-mel.png",
"Graduando em Ciência da Computação",
null,
"Desenvolvimento",
],
[
"Natália Mathias",
"team-nat.png",
"Graduanda em Comunicação Visual Design",
"http://linkedin.com/in/natalia-mathias91",
"Design",
],
[
"Pedro Henrique",
"team-avatar.png",
"Graduando em Ciência da Computação",
"http://linkedin.com/in/pedro-henrique-dos-santos-porto-a85593124/",
"Desenvolvimento",
],
[
"Renata Novoa",
"team-re.png",
"Graduanda em Comunicação Visual Design",
"http://linkedin.com/in/renata-novoa/",
"Design",
],
[
"Vitor Lucio Giorgio",
"team-vitor.png",
"Graduando em Ciência da Computação",
"http://linkedin.com/in/vitor-lucio-giorgio/",
"Desenvolvimento",
],
]);
</script>
</section>
<section class="w-section subscribe">
<p>
<a href="ex-membros.html"
>Outros membros que já passaram pelo Caronaê</a
>
</p>
</section>
<!-- Falaê -->
<section id="contato" class="w-section subscribe">
<h2 class="subscribe-title big-title">Falaê</h2>
<p class="sobre-p">
Aceitamos sugestões de funcionalidades, ideias e feedbacks para o novo
aplicativo que será desenvolvido. Sinta-se à vontade para entrar em
contato através do nosso e-mail:
<a href="mailto:caronae@caronae.org">caronae@caronae.org</a>
</p>
<!-- <div class="w-form form">
<form id="email-form" name="email-form" data-name="Email Form" class="w-clearfix">
<div class="w-row lines-container">
<div class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line brown"></div>
<div class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line blue"></div>
<div class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line pink"></div>
<div class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line green"></div>
<div class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line orange"></div>
<div class="w-col w-col-2 w-col-small-2 w-col-tiny-2 header-line red"></div>
</div>
<label for="nome" class="form-label">Nome</label>
<input id="nome" type="text" placeholder="Quem é você?" name="nome" data-name="nome" class="w-input line-input">
<label for="email-2" class="form-label">Email</label>
<input id="email-2" type="email" placeholder="nome@email.com" name="email" data-name="email" required="required" class="w-input line-input">
<label for="assunto" class="form-label">Assunto</label>
<input id="assunto" type="text" placeholder="Sugestão" name="assunto" data-name="assunto" required="required" class="w-input line-input">
<label for="mensagem" class="form-label">Mensagem</label>
<textarea id="mensagem" placeholder="Falaê, mande sua mensagem" name="mensagem" data-name="mensagem" class="w-input form-textarea"></textarea>
<input type="submit" value="Enviar" data-wait="Aguarde um momento..." class="w-button button btn">
</form>
<div class="w-form-done">
<p>Obrigado! Sua mensagem foi enviada, em breve entraremos em contato.</p>
</div>
<div class="w-form-fail">
<p>Ah, não! Algo deu errado no envio, por favor tente de novo.</p>
</div>
</div> -->
</section>
<script
type="text/javascript"
src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"
></script>
<script type="text/javascript" src="js/webflow.js"></script>
<script type="text/javascript" src="js/get-parameter.js"></script>
<!--[if lte IE 9
]><script src="https://cdnjs.cloudflare.com/ajax/libs/placeholders/3.0.2/placeholders.min.js"></script
><![endif]-->
<script>
$(document).ready(function () {
$(".footer").load("footer.html");
});
$(document).ready(function () {
$(".pergunta-title").click(function () {
$(this).parent().find(".resposta").slideToggle(300);
});
});
var name = getParameterByName("falaeName");
var subject = getParameterByName("falaeSubject");
var message = getParameterByName("falaeMessage");
if (subject != null) {
document.getElementById("nome").value = name;
document.getElementById("assunto").value = subject;
document.getElementById("mensagem").value = message;
}
</script>
<div class="footer"></div>
</body>
</html>