-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
127 lines (125 loc) · 6.13 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
<!DOCTYPE html>
<html>
<head>
<title>Projeto 03</title>
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/style.css">
<meta charset="utf-8"/>
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0"/>
</head>
<body>
<header>
<div class="container">
<div class="logo"></div><!--logo-->
<nav class="desktop-menu">
<ul>
<li><a href="">home</a></li>
<li><a href="">serviços</a></li>
<li><a href="">sobre</a></li>
<li><a href="">contato</a></li>
</ul>
</nav>
<nav class="mobile-menu">
<ul>
<li><a href="">home</a></li>
<li><a href="">serviços</a></li>
<li><a href="">sobre</a></li>
<li><a href="">contato</a></li>
</ul>
</nav>
<div class="clear"></div>
<div class="chamada1">
<h2>Sistemas próprios<br />Para empresas autênticas</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla pretium facilisis arcu ac eleifend. Nam aliquam et sem vitae aliquet. Duis sapien nibh, posuere tincidunt vulputate et, pellentesque quis ex.</p>
</div><!--chamada1-->
</div><!--container-->
</header>
<section class="sessao1">
<div class="container">
<div class="texto-sessao1">
<h2>Desenvolvemos sistemas únicos</h2>
<p>Para todas as plataformas e diversos segmentos:</p>
<ul>
<li>Lojas virtuais</li>
<li>Sites institucionais</li>
<li>Sistemas corporativos</li>
<li>Muitos outros</li>
</ul>
<div class="clear"></div>
<div class="btn-1-texto">Entre em contato</div>
</div>
<div class="device-sessao1"></div>
<div class="clear"></div>
</div>
</section>
<section class="sessao2">
<div class="container">
<h2>Desenvolvido por pessoas e para pessoas</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla pretium facilisis arcu ac eleifend. Nam aliquam et sem vitae aliquet. Duis sapien nibh, posuere tincidunt vulputate et, pellentesque quis ex.
</p>
<img src="images/mockup.jpg"/>
</div>
</section>
<section class="sessao3">
<div class="part1">
<div class="wraper-part1">
<h2>Nosso time</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla pretium facilisis arcu ac eleifend. Nam aliquam et sem vitae aliquet. Duis sapien nibh, posuere tincidunt vulputate et, pellentesque quis ex.</p>
</div>
</div>
<div class="part2">
<div class="sobre-autor">
<div class="titulo-autor">
<div class="wraper-titulo-autor">
<h2>Rafaella Pinho</h2>
<p>Desenvolvedora</p>
</div>
<div class="img-autor"></div>
</div>
<div class="texto-autor">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla pretium facilisis arcu ac eleifend.</p>
</div>
</div>
<div class="slider-bullets">
<span style="background-color: black;"></span>
<span></span>
<span></span>
</div>
</div>
<div class="clear"></div>
</section>
<section class="sessao4">
<div class="container">
<div class="form">
<h2>Entre em contato</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla pretium facilisis arcu ac eleifend.</p>
<form>
<div><input type="text" name="Nome" placeholder="Nome"></div>
<div><input type="text" name="Email" placeholder="Email"></div>
<div><textarea name="Mensagem" placeholder="Mensagem"></textarea></div>
<div class="clear"></div>
<div><input type="submit" value="Enviar"></div>
</form>
</div><!--form-->
<div class="map-wraper">
<h2>Faça uma visita</h2>
<div class="map-wraper3">
<div class="map-wraper2">
<script src='https://maps.googleapis.com/maps/api/js?v=3.exp&key=AIzaSyBKYNGU3x11nV9qHDxy1OMljhWbwXzY18Y '></script><div class="map" id='gmap_canvas'></div><style>#gmap_canvas img{max-width:none!important;background:none!important}</style> <a href='http://maps-generator.com/pt'>Maps-Generator</a><script type='text/javascript'>function init_map(){var myOptions = {zoom:14,center:new google.maps.LatLng(-31.7427448,-52.34769829999999),mapTypeId: google.maps.MapTypeId.ROADMAP};map = new google.maps.Map(document.getElementById('gmap_canvas'), myOptions);marker = new google.maps.Marker({map: map,position: new google.maps.LatLng(-31.7427448,-52.34769829999999)});infowindow = new google.maps.InfoWindow({content:'<strong>Meu mapa</strong><br>Pedro Moacir<br>06510 Pelotas<br>'});google.maps.event.addListener(marker, 'click', function(){infowindow.open(map,marker);});infowindow.open(map,marker);}google.maps.event.addDomListener(window, 'load', init_map);</script>
</div><!--map-wraper2-->
</div><!--map-wraper3-->
</div><!--map-wraper-->
<div class="clear"></div>
</div><!--container-->
</section><!--sessao4-->
<footer>
<div class="container">
<p>Todos os direitos reservados</p>
<p>[email protected]</p>
<div class="clear"></div>
</div><!--container-->
</footer>
</body>
</html>