forked from fede1995a/navbar
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
157 lines (143 loc) · 6.35 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
<!DOCTYPE html>
<html lang="en">
<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">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" />
<title>Navbar</title>
<link rel="stylesheet" href="/style.css">
</head>
<body>
<!-- Navbar -->
<header class="header">
<img src="/img/Logo.png" alt="logonav" class="logo">
<nav class="nav">
<ul class="nav-list">
<li class="nav-item"><a href="#" class="nav-link">Inicio</a></li>
<li class="nav-item"><a href="#" class="nav-link">Contacto</a></li>
<li class="nav-item"><a href="#" class="nav-link">Productos</a>
</li>
</ul>
</nav>
</header>
<main>
<!-- Section 1 Principal -->
<section class="padre">
<div class="conteiner">
<h2 class="title">F CORP FITNESS</h2>
<p class="lem">Somos la marca lider en productos y maquinarias para Gimnasios, tenemos una oferta segun tu necesidad, pudiendo generarte espacios en tu propio hogar o lugar común donde haces ejercicio.
</p>
<span><img class="foto" src="/img/Gym.png" alt="maquina2"></a></span>
<div class="btn">
<a href="#" class="btn-1">VER CATALOGO </a>
<a href="#" class="btn-2">PROMOCIONES</a>
</div>
<!-- Section 2 Beneficios -->
</section>
<section class="description-section">
<h2 class="animate__animated animate__backInDown">Ventajas de trabajar con nosotros</h2>
<p>Calidad inigualable</p>
<div class="card-conteiner">
<!-- Card 1 -->
<div class="card">
<h2>1</h2>
<p>Somos marca lider en calidad de materia prima</p>
</div>
<!-- Card 2 -->
<div class="card">
<h2>2</h2>
<p>Tenemos servicio post venta premium personalizado</p>
</div>
<!-- Card 3 -->
<div class="card">
<h2>3</h2>
<p>Todos nuestros clientes dejan su reseña para que puedas verla y asegurarte de nuestra calidad</p>
</div>
</div>
</section>
<!-- Section 3 HOW WE WORK -->
<section class="container-items">
<h2 class="animate__animated animate__backInDown">HOW WE WORK?</h2>
<p>Servicio post venta personalizado para cada cliente</p>
<!-- Card 1 -->
<div class="card-container">
<div class="item">
<img src="/img/info-icon-1.png" alt="Info 1" class="info-card">
<p>Una vez que compras agregas la opcion de servicio Premium</p>
</div>
<!-- Card 2 -->
<div class="item">
<img src="/img/info-icon-2.png" alt="Info 1" class="info-card">
<p>Una vez compras el servicio premium de post venta entras en contacto directo con los desarrolladores</p>
</div>
<!-- Card 3 -->
<div class="item">
<img src="/img/info-icon-3.png" alt="Info 1" class="info-card">
<p>Cualquier duda consulta o modificacion a realizar sera recibida y atentida con un servicio personalizado</p>
</div>
</div>
</div>
</section>
<!-- Seccion 4 CLIENTES -->
<section class="clients">
<h2 class="animate__animated animate__backInDown">Nuestros Clientes</h2>
<p> Lista de compañías a las que le hemos brindado nuestro servicio</p>
<div class="dad">
<!-- Card 1 -->
<div class="itemz">
<a href="#" target="_blank"><img src="/img/descarga.png" alt="Imagen1" class="info-cardd"></a>
</div>
<!-- Card 2 -->
<div class="itemz">
<a href="#" target="_blank"><img src="/img/descarga.png" alt="Imagen1" class="info-cardd"></a>
</div>
<!-- Card 3 -->
<div class="itemz">
<a href="#" target="_blank"><img src="/img/descarga.png" alt="Imagen1" class="info-cardd"></a>
</div>
<!-- Card 4 -->
<div class="itemz">
<a href="#" target="_blank"><img src="/img/descarga.png" alt="Imagen1" class="info-cardd"></a>
</div>
<!-- Card 5 -->
<div class="itemz">
<a href="#" target="_blank"><img src="/img/descarga.png" alt="Imagen1" class="info-cardd"></a>
</div>
</section>
<footer>
<div class="pkpkpk"> <img src="/img/Logo.png" alt="logofoter" class="kuki">
<div>
<h2 class="animate__animated animate__backInDown">Contactenos</h2>
<a href="#" class="ofices">
<p> Oficinas ITALIA</p>
</a>
<a href="#" class="ofices">
<P>Oficinas USA</P>
</a>
<a href="#" class="ofices">
<p>Oficinas ESPAÑA</p>
</a>
<a href="#" class="ofices">
<p>Oficinas BRASIL</p>
</a>
<a href="#" class="ofices">
<p>Oficinas ARGENTINA</p>
</a>
</div>
<div class="redes">
<p>
<a href="#" target="_blank"><img src="/img/facebook.png" alt="logito" class="logito"></a>
</p>
<P>
<a href="#" target="_blank"><img src="/img/instagram.png" alt="logito" class="logito"></a>
</P>
<p>
<a href="#" target="_blank"><img src="/img/twitter1.png" alt="logito" class="logito"></a>
</p>
</div>
</div>
</footer>
</main>
</body>
</html>