-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
153 lines (139 loc) · 6.88 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
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title> Game Invest </title>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=EB+Garamond:wght@400;500;700&family=Inter:wght@300;400;700;900&family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=Press+Start+2P&display=swap"rel="stylesheet" />
<link href="https://fonts.google.com/share?selection.family=Poppins:wght@500" rel="stylesheet"/>
<link rel="icon" type="imagem/png" href="assets/favicon.ico" />
<!-- Css -->
<link rel="stylesheet" href="./assets/index/css/join.css">
</head>
<body>
<!-- Header -->
<header class="main-header">
<div class="header-main">
<a href="index.html">
<img id="logo" src="./assets/saiba-mais/img/header/logo.svg" />
</a>
<nav class="header__nav">
<ul class="nav-ul" id="nav-bar">
<li><a href="#descricao" class="nav-li">Descrição</a></li>
<li><a href="#Vantagens" class="nav-li">Vantagens</a></li>
</ul>
</nav>
<button onclick="navbar()" class="header__Botao__Burguer" type="button" data-toggle="collapse">
<img src="./assets/saiba-mais/img/header/Group 57.png" alt="Burguer navegação">
</button>
</div>
</header>
<!-- Header -->
<!-- Home -->
<section id="home" alt="HomePage">
<div class="container_home">
<div class="home_texto">
<h1 class="home_titulo">
Preparado para entrar no mundo dos investimentos?
</h1>
<p class="home_descricao">Descubra o seu perfil de investidor por meio do nossso game RPG e ainda
adquira um conhecimento básico para começar a investir de forma segura e condizente com você e seus objetivos.
</p>
<div class="button__container">
<button><a class="button__index__jogar" href="phaser/index.html">Jogar</a></button>
<button id="saber"><a class="button__index__saber" href="saiba-mais.html">Saber mais</a></button>
</div>
</div>
</div>
</section>
<!-- Home -->
<!-- Explicação Do RPG -->
<section id="descricao" class='explicandoRPG'>
<div class="container_explicação_do_RPG">
<div class="textoRpg1">
<div class="texto1">
<p class="explicandoTexto" data-anime="right">O nosso projeto foi criado com a proposta de dar aos jovens que nunca investiram <b>os primeiros passos</b> para
entrar no mundo do mercado financeiro e também entender a importância de tal feito.</p>
</div>
<div class="texto2"
<p data-anime="right">Começar a investir pode ser uma motivação tanto para aquele que está endividado, mas
buscando fazer um controle financeiro, como para aquele que já consegue guardar algum dinheiro, mas não
sabe como faze-lo render.</p>
</div>
</div>
</section>
<!-- Explicação Do RPG -->
<!-- Vantagens de Investir -->
<section id = 'Vantagens' alt= 'Seção Vantagens'>
<h2>Conheça as vantagens de investir</h2>
<div class = 'container descricao'>
<div class = 'flex-vantagens'>
<div class = 'item-vantagens'>
<img src = 'assets/saiba-mais/img/vantagens-de-investir/bag.svg' alt = ''>
<p><strong> Segurança </strong> <br/></p>
<p>
Investir pode lhe garantir estabilidade e uma reserva financeira em tempos de crise.
</p>
</div>
<div class = 'item-vantagens'>
<img src = 'assets/saiba-mais/img/vantagens-de-investir/heart.svg'>
<p>
Mais liberdade e possibilidades de realizar suas metas e sonhos, como ter dinheiro para fazer aquela viagem!
</p>
</div>
<div class = 'item-vantagens'>
<img src = 'assets/saiba-mais/img/vantagens-de-investir/moedas.svg'>
<p><strong> Acumular patrimônio </strong></p>
<p>
Fazer o dinheiro trabalhar pra você é uma ótima forma de multiplicar seu capital.
</p>
</div>
</div>
</div>
</section>
<!-- Vantagens de Investir -->
<!-- Footer -->
<footer class="main-footer">
<!-- Listras -->
<img src='assets/index/img/footer/listras.svg' alt='' class='listras'>
<div class='container footer'>
<!-- Logo Game Invest -->
<img src='assets/index/img/footer/logo.svg' alt='Logo' class="logo">
<!-- Título do Footer -->
<p class="titulo-footer">Projeto desenvolvido pelo time do <strong>Programa Trilhas - Inova Maranhão</strong></p>
<div class='flex-footer'>
<div class='item-footer'>
<h4>Time Dados</h4>
<a href="#" class='link-footer'><img src='assets/index/img/footer/linkedin.svg'>Clebson Machado</a>
<a href="https://www.linkedin.com/in/felipeecp/" class='link-footer'><img src='assets/index/img/footer/linkedin.svg'>Luiz Felipe</a>
<a href="https://www.linkedin.com/in/railsondoglas" class='link-footer'><img src='assets/index/img/footer/linkedin.svg'>Railson Douglas</a>
</div>
<div class='item-footer'>
<h4>Time Design</h4>
<!-- <a href="#" class='link-footer'><img src='assets/index/img/footer/linkedin.svg'>Ayla Andrade</a>
<a href="#" class='link-footer'><img src='assets/index/img/footer/linkedin.svg'>Elda Ramos</a> -->
<a href="https://www.linkedin.com/in/maysa-mafra-7a33bb146" class='link-footer'><img src='assets/index/img/footer/linkedin.svg'>Maysa Mafra</a>
</div>
<div class='item-footer'>
<h4>Time Programação</h4>
<a href="https://www.linkedin.com/in/ana-j%C3%BAlia-alencar/" class='link-footer'><img src='assets/index/img/footer/linkedin.svg'>Ana Júlia Alencar</a>
<a href="https://www.linkedin.com/in/igor-lima-pereira-577872186" class='link-footer'><img src='assets/index/img/footer/linkedin.svg'>Igor Lima</a>
<a href="https://www.linkedin.com/in/joao-guilherme-garcia-castro" class='link-footer'><img src='assets/index/img/footer/linkedin.svg'>João Guilherme </a>
<a href="https://www.linkedin.com/in/kelvynreis/" class='link-footer'><img src='assets/index/img/footer/linkedin.svg'>Kelvyn Reis</a>
<a href="https://www.linkedin.com/in/melpalhano/" class='link-footer'><img src='assets/index/img/footer/linkedin.svg'>Melissa Palhano</a>
</div>
</div>
<p class="copyright">
Copyright © 2022. GameInvest All rights reserved.
</p>
</div>
</footer>
<!-- Footer -->
</main>
<script src="./assets/index/js/main.js"></script>
<script src="./assets/index/js/scroll.js"></script>
</body>
</html>