-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
111 lines (93 loc) · 6.05 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
<html>
<head>
<title>Minha Landing Page</title>
<link href="css/style.css" type="text/css" rel="stylesheet" />
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
<meta name="description" content="Conteúdo do meu site.">
<meta name="keywords" content="palavras,separadas,por,virgula">
<meta name="author" content="Gabriel" />
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0" />
<meta charset="utf-8" />
<!-- Bora ganhar T-shrit -->
</head>
<body>
<header>
<div class="container">
<div><div class="logo-1"></div></div>
<div><div class="logo-2"></div></div>
<div class="clear"></div>
</div>
</header>
<section class="cover-form">
<div class="container bg">
<div class="form-container">
<h2>Confira com a nossa empresa pfv!</h2>
<form>
<div class="form-wraper">
<p>*Nome Completo</p>
<input type="text" name="nome" required placeholder="Nome">
</div>
<div class="form-wraper">
<p>*E-mail</p>
<input type="text" name="nome" required placeholder="E-mail">
</div>
<div class="form-wraper">
<p>*Telefone</p>
<input type="text" name="nome" required placeholder="Telefone">
</div>
<div class="form-wraper">
<input type="submit" name="acao" value="Enviar">
</div>
<div class="form-wraper">
<p>* Campos Obrigatórios</p>
</div>
</form>
</div>
</div>
</section>
<section class="chamada">
<div class="icone-seta"></div>
<div class="container">
<h2>Viva a vida que você sempre sonhou</h2>
<p>Coberturas e apartamentos de frente para o mar no João Paulo.</p>
</div>
</section>
<section class="mosaico">
<div class="container">
<div class="flex-mosaico">
<div style="background-image:url('imagens/mosaico1.jpg');" class="item-1-mosaico">
</div>
<div class="item-2-mosaico">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean posuere sodales neque id scelerisque. Proin a felis id elit scelerisque fermentum. Nullam mauris dui, efficitur vitae dictum at, tempus et sem. Morbi aliquam maximus eros in lacinia. Fusce aliquet semper ante, at egestas risus malesuada non. Vestibulum id lobortis mauris. Nullam molestie neque a arcu convallis, vel dignissim urna vestibulum. Sed mollis, mauris eget consectetur dapibus, mauris erat pretium metus, vitae rhoncus tellus est eget risus.</p>
</div>
</div>
<div class="flex-mosaico">
<div style="order:2; background-image:url('imagens/mosaico1.jpg');" class="item-1-mosaico">
</div>
<div style="order: 1" class="item-2-mosaico">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean posuere sodales neque id scelerisque. Proin a felis id elit scelerisque fermentum. Nullam mauris dui, efficitur vitae dictum at, tempus et sem. Morbi aliquam maximus eros in lacinia. Fusce aliquet semper ante, at egestas risus malesuada non. Vestibulum id lobortis mauris. Nullam molestie neque a arcu convallis, vel dignissim urna vestibulum. Sed mollis, mauris eget consectetur dapibus, mauris erat pretium metus, vitae rhoncus tellus est eget risus.</p>
</div>
</div>
<div class="flex-mosaico">
<div style="background-image:url('imagens/mosaico1.jpg');" class="item-1-mosaico">
</div>
<div class="item-2-mosaico">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean posuere sodales neque id scelerisque. Proin a felis id elit scelerisque fermentum. Nullam mauris dui, efficitur vitae dictum at, tempus et sem. Morbi aliquam maximus eros in lacinia. Fusce aliquet semper ante, at egestas risus malesuada non. Vestibulum id lobortis mauris. Nullam molestie neque a arcu convallis, vel dignissim urna vestibulum. Sed mollis, mauris eget consectetur dapibus, mauris erat pretium metus, vitae rhoncus tellus est eget risus.</p>
</div>
</div>
<div class="flex-mosaico">
<div style="order:2; background-image:url('imagens/mosaico1.jpg');" class="item-1-mosaico">
</div>
<div style="order: 1" class="item-2-mosaico">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean posuere sodales neque id scelerisque. Proin a felis id elit scelerisque fermentum. Nullam mauris dui, efficitur vitae dictum at, tempus et sem. Morbi aliquam maximus eros in lacinia. Fusce aliquet semper ante, at egestas risus malesuada non. Vestibulum id lobortis mauris. Nullam molestie neque a arcu convallis, vel dignissim urna vestibulum. Sed mollis, mauris eget consectetur dapibus, mauris erat pretium metus, vitae rhoncus tellus est eget risus.</p>
</div>
</div>
</div>
</section>
<footer>
<img src="imagens/logo1.png" />
<p>Todos os direitos reservados</p>
<p>Contato: 3222-3223</p>
</footer>
</body>
</html>