-
Notifications
You must be signed in to change notification settings - Fork 0
/
bolsa-aire.html
195 lines (155 loc) · 15.7 KB
/
bolsa-aire.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
<!DOCTYPE html>
<html lang="es-MX" class="scroll-smooth">
<head>
<meta charset="UTF-8">
<title>Leaf Spring México | Bolsas de Aire</title>
<meta name="description" content="Nuestras bolsas están garantizadas, al ser de la más alta calidad. Ideales para tractocamiones, autobuses y remolques, ya sea en cabinas o suspensiones." />
<meta name="keywords" content="Suspensiones,Leaf,Spring,Mexico,Muelles,Amortiguadores,Hule,Natural,Mecanico,Partes,Refacciones,Camion,Trailer,Vehiculo,Calidad,Solucion,Soluciones,Bolsa,Bolsas,Aire,Productos,Z,Muelles en Z,Sistema,Sistemas,Frenos,Sistemas de frenos,Banderin,Soporte,Deslizante,Trifuncional,Hendrickson,Dina,Toyota,Gabriel,Chrysler,Ford,Fruehauf,Buje,Contacto,Integral,Carga,Ligero,Pesado,Variedad,Accesorios,Nucleos,Tensor,Tambores,Zapatas,Balatas,Mercadoshop,Nosotros,Guadalajara,Exportacion,Importacion,Internacional,rrgo,design">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="canonical" href="https://leafspringmexico.com/bolsa-aire.html">
<link rel="alternate" hreflang="en-US" href="https://leafspringmexico.com/bolsa-aire.html">
<link rel="alternate" hreflang="en-MX" href="https://leafspringmexico.com/bolsa-aire.html">
<link rel="alternate" hreflang="es-MX" href="https://leafspringmexico.com/bolsa-aire.html">
<link rel="alternate" hreflang="x-default" href="https://leafspringmexico.com/bolsa-aire.html">
<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=Oswald:wght@200;300;400;500;600;700&family=Prompt:wght@300;400;500;600;700&family=Roboto+Mono:wght@300;400;500;600;700&family=Roboto:ital,wght@0,300;0,400;0,500;0,700;0,900;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet">
<link rel="stylesheet" href="./css/main.css">
<script src="https://kit.fontawesome.com/9846627988.js" crossorigin="anonymous"></script>
<link rel="shortcut icon" href="img/logos/leaf-spring/ls-favicon-wht.svg" type="image/x-icon" />
</head>
<body class="flex flex-col w-full overflow-x-hidden antialiased bg-offWhite" tabindex="-1">
<!-- MAIN MENU -->
<div id="ham" class="fixed z-50 flex flex-col items-center justify-center hidden w-full h-screen overflow-x-hidden overflow-y-hidden text-4xl tracking-wide duration-500 origin-left bg-verdeLeaf text-offWhite laptop:hidden">
<ul class="font-roboto">
<li class="pb-3 duration-500 hover:text-amber-400 hover:translate-x-4"><a href="index.html"><i class="pr-4 fa-solid fa-house fa-xs" style="color: #F2F2F2;"></i>Inicio</a></li>
<li class="pb-3 duration-500 hover:text-amber-400 hover:translate-x-4"><a href="nosotros.html"><i class="pr-4 fa-solid fa-users fa-xs" style="color: #F2F2F2;"></i>Nosotros</a></li>
<li class="pb-3 duration-500 hover:text-amber-400 hover:translate-x-4"><a href="productos.html"><i class="pr-4 fa-solid fa-screwdriver-wrench fa-xs" style="color: #F2F2F2;"></i>Productos</a></li>
<li class="pb-3 duration-500 hover:text-amber-400 hover:translate-x-4"><a href="contacto.html"><i class="pr-4 fa-solid fa-envelope fa-xs" style="color: #F2F2F2;"></i>Contacto</a></li>
</ul> <!-- BOTON CERRAR -->
<div id="closeBtn" class="absolute text-3xl cursor-pointer top-9 right-5">
<i name="cerrar" onclick="Close(this)" class="fa-solid fa-xmark text-offWhite"></i>
</div>
</div>
<!-- NAVBAR -->
<nav id="inicio" class="sticky top-0 z-50 flex flex-row self-center w-full p-3 drop-shadow-lg laptop:items-center laptop:justify-around laptop:p-6 laptop:w-full bg-zinc-100">
<div class="flex flex-row items-center justify-between flex-grow mx-auto align-middle laptop:justify-around">
<a href="index.html">
<img src="./img/logos/leaf-spring/ls-logo.svg" alt="logo leaf spring" class="h-16 pl-2 laptop:pl-0 laptop:h-24">
</a>
<!-- HAMBURGER MENU MOBILE -->
<div>
<!-- HAMBURGER MENU ICON -->
<div id="hamBtn" class="fixed flex flex-row p-2 text-4xl align-middle rounded-md cursor-pointer laptop:hidden right-3 top-6 bg-zinc-200">
<img onclick="Open(this)" src="img/icons/hamburger-md-svgrepo-com.svg" alt="hamburger menu" title="hamburger menu" class="h-6 duration-500 laptop:hidden">
</div>
<!-- MENU -->
<ul class="hidden laptop:flex-row laptop:gap-24 laptop:list-none laptop:flex">
<li class="items-center">
<a href="index.html" class="items-center self-center hidden laptop:flex laptop:flex-row laptop:text-2xl laptop:font-semibold laptop:tracking-wide laptop:transition-all laptop:duration-500 laptop:ease-in-out laptop:font-roboto laptop:text-zinc-500 group"><i class="pr-2 fa-solid fa-house fa-xs" style="color: #029673;"></i><span class="bg-left-bottom bg-gradient-to-r from-verdeClaroLeaf pl-0 pr-4 py-1 to-verdeLeaf bg-[length:0%_2px] bg-no-repeat group-hover:bg-[length:100%_2px] transition-all duration-500 ease-out hover:text-verdeClaroLeaf">Inicio</span></a>
</li>
<li class="items-center">
<a href="nosotros.html" class="items-center hidden laptop:flex laptop:flex-row laptop:text-2xl laptop:font-semibold laptop:tracking-wide laptop:transition-all laptop:duration-500 laptop:ease-in-out laptop:font-roboto laptop:text-zinc-500 group"><i class="pr-3 fa-solid fa-users fa-sm" style="color: #029673;"></i><span class="bg-left-bottom bg-gradient-to-r from-verdeClaroLeaf pl-0 pr-4 py-1 to-verdeLeaf bg-[length:0%_2px] bg-no-repeat group-hover:bg-[length:100%_2px] transition-all duration-500 ease-out hover:text-verdeClaroLeaf">Nosotros</span></a>
</li>
<li class="items-center">
<a href="productos.html" class="items-center hidden laptop:flex laptop:flex-row laptop:text-2xl laptop:font-semibold laptop:tracking-wide laptop:transition-all laptop:duration-500 laptop:ease-in-out laptop:font-roboto laptop:text-zinc-500 group"><i class="pr-2 fa-solid fa-screwdriver-wrench fa-sm" style="color: #029673;"></i><span class="bg-left-bottom bg-gradient-to-r from-verdeClaroLeaf pl-0 pr-4 py-1 to-verdeLeaf bg-[length:0%_2px] bg-no-repeat group-hover:bg-[length:100%_2px] transition-all duration-500 ease-out hover:text-verdeClaroLeaf">Productos</span></a>
</li>
<li class="items-center">
<a href="contacto.html" class="items-center hidden laptop:flex laptop:flex-row laptop:text-2xl laptop:font-semibold laptop:tracking-wide laptop:transition-all laptop:duration-500 laptop:ease-in-out laptop:font-roboto laptop:text-zinc-500 group"><i class="pr-2 fa-solid fa-envelope fa-sm" style="color: #029673;"></i><span class="bg-left-bottom bg-gradient-to-r from-verdeClaroLeaf pl-0 pr-4 py-1 to-verdeLeaf bg-[length:0%_2px] bg-no-repeat group-hover:bg-[length:100%_2px] transition-all duration-500 ease-out hover:text-verdeClaroLeaf">Contacto</span></a>
</li>
</ul>
</div>
</nav>
<!-- BANNER / SLOGAN -->
<h1 class="w-full py-3 text-xl font-semibold tracking-wide text-center uppercase text-offWhite bg-[#05775D] h-30 font-roboto laptop:text-4xl laptop:py-6">
Bolsas de Aire</h1>
<p class="p-6 text-xl font-normal text-center laptop:px-32 bg-neutral-200 drop-shadow-md laptop:pt-8 laptop:text-xl font-oswald text-neutral-700 ">
Nuestras bolsas están garantizadas, al ser de la más alta calidad. Ideales para tractocamiones, autobuses y
remolques, ya sea en cabinas o suspensiones rectas y doble envolventes (hamburguesa).</p>
<!-- PRODUCTOS / MAIN -->
<section class="flex flex-col w-full h-full bg-neutral-400">
<div class="flex w-full h-screen bg-neutral-400">
<object data="./assets/pdf/gabriel/gabriel-bolsas.pdf" type="application/pdf" class="w-10/12 h-full pt-10 pb-5 mx-auto laptop:pt-20 laptop:pb-10"></object>
</div>
<!-- DESTACADOS BOLSA DE AIRE -->
<div class="flex flex-col items-center w-full mx-auto tablet:pb-10 bg-neutral-400 laptop:flex-row laptop:justify-center laptop:gap-16">
<div class="items-center justify-center col-span-2 px-6 py-3 mx-8 my-8 text-center rounded-lg laptop:px-0 laptop:py-0 laptop:w-32 bg-grisLeaf laptop:bg-transparent laptop:text-left justify-items-center">
<p class="text-3xl font-semibold tracking-wide text-offWhite bigHor:text-2xl mobileHor:text-2xl font-roboto laptop:text-offBlack tablet:text-4xl laptop:text-3xl">
Destacados Bolsa de Aire
</p>
</div>
<button tabindex="-1" class="flex flex-row items-center w-auto gap-10 pb-10 duration-300 laptop:pb-0 laptop:gap-0 laptop:flex-col">
<a target="_self" href="https://articulo.mercadolibre.com.mx/MLM-845377366-bolsa-aire-9547-1r11-268-kenworth-air-glide-400-gabriel-_JM#position=1&search_layout=grid&type=item&tracking_id=b0f4e3a5-67df-4783-b509-075aa8c782da" tabindex="0">
<img src="./img/prods/bolsas-aire/gabriel/gabriel-bolsa-9547.jpg" class="h-32 duration-500 rounded-lg hd:h-44 tablet:h-52 ipad:h-24 laptop:h-40 hover:scale-110" alt="muelle en z hendrickson 50389" title="muelle en z hendrickson 50389"></a>
<p class="items-center justify-center mx-auto text-lg font-semibold text-left duration-300 tablet:text-center laptop:pt-5 hover:text-offWhite font-oswald w-28">
Bolsa Aire 9547 1R11-221 Kenworth Air Glide 400
</p>
</button>
<button tabindex="-1" class="flex flex-row items-center w-auto gap-10 pb-10 duration-300 laptop:pb-0 laptop:gap-0 laptop:flex-col">
<a target="_self" href="https://articulo.mercadolibre.com.mx/MLM-817336568-bolsa-aire-9622-1r11-221-kenworth-t2000-8-bolsas-gabriel-_JM#position=1&search_layout=grid&type=item&tracking_id=b1a5c8db-c4bc-46f6-8042-4c90b53deecf" tabindex="0">
<img src="./img/prods/bolsas-aire/gabriel/gabriel-bolsa-9622.jpg" class="h-32 duration-500 rounded-lg hd:h-44 tablet:h-52 ipad:h-24 laptop:h-40 hover:scale-110" alt="muelle en z navistar 551195" title="muelle en z navistar 551195"></a>
<p class="items-center justify-center mx-auto text-lg font-semibold text-left duration-300 tablet:text-center laptop:pt-5 hover:text-offWhite font-oswald w-28">
Bolsa Aire 9622 1R11-221 Kenworth T2000 8 Bolsas
</p>
</button>
<button tabindex="-1" class="flex flex-row items-center w-auto gap-10 pb-10 duration-300 laptop:pb-0 laptop:self-stretch laptop:gap-0 laptop:flex-col">
<a target="_self" href="https://articulo.mercadolibre.com.mx/MLM-817352285-bolsa-aire-8713-1r13-176-1r13-140-hendrickson-_JM#position=1&search_layout=grid&type=item&tracking_id=3e7d23f9-ad1f-4fc0-96b1-c19c5ae1adba" tabindex="0">
<img src="./img/prods/bolsas-aire/gabriel/gabriel-bolsa-8713.jpg" class="h-32 duration-500 rounded-lg hd:h-44 tablet:h-52 ipad:h-24 laptop:h-40 hover:scale-110" alt="muelle en z volvo 961261" title="muelle en z volvo 961261"></a>
<p class="items-center justify-center mx-auto text-lg font-semibold text-left duration-300 tablet:text-center laptop:pt-5 hover:text-offWhite font-oswald w-28">
Bolsa Aire 8713 1R13-176 1R13-140 Hendrickson</p>
</button>
<button tabindex="-1" class="flex flex-row items-center w-auto gap-10 pb-10 duration-300 laptop:self-stretch laptop:pb-0 laptop:gap-0 laptop:flex-col">
<a target="_self" href="https://articulo.mercadolibre.com.mx/MLM-1342150334-bolsa-aire-7087-1s5-040-cabina-freightliner-gabriel-_JM#position=1&search_layout=grid&type=item&tracking_id=89de7997-0bfd-4f97-b848-0baaaf034695" tabindex="0">
<img src="./img/prods/bolsas-aire/gabriel/gabriel-bolsa-7087.jpg" class="h-32 duration-500 rounded-lg hd:h-44 tablet:h-52 ipad:h-24 laptop:h-40 hover:scale-110" alt="muelle en z volvo 961261" title="muelle en z volvo 961261"></a>
<p class="items-center justify-center mx-auto text-lg font-semibold text-left duration-300 tablet:text-center laptop:pt-5 hover:text-offWhite font-oswald w-28">
Bolsa Aire 7087 1S5-040 Cabina Freightliner</p>
</button>
</div>
<!-- MAPS / FOOTER -->
<div id="resume" class="items-center justify-center w-full h-auto align-middle text-offWhite font-roboto">
<!-- FOOTER -->
<footer id="footer" class="grid grid-cols-1 gap-5 p-8 bg-grisLeaf laptop:grid-cols-6 laptop:grid-rows-1 laptop:gap-10 laptop:p-10">
<!-- LOGO FOOTER -->
<div class="justify-center laptop:col-start-1 laptop:col-end-1">
<a href="./index.html">
<img class="h-16 pb-6 laptop:h-20" src="./img/logos/leaf-spring/ls-logo-wht.svg" alt="logo leaf spring mexico"></a>
</div>
<div class="pb-6 laptop:pb-0 rounded-xl laptop:col-start-2 laptop:col-end-2">
<ul>
<li class="laptop:pb-3"><a class="pb-2 text-gray-200 duration-500 laptop:pb-0 laptop:hover:pl-2 hover:text-verdeClaroLeaf w-fit" href="index.html">inicio</a></li>
<li class="laptop:pb-3"><a class="pb-2 text-gray-200 duration-500 laptop:pb-0 laptop:hover:pl-2 hover:text-verdeClaroLeaf w-fit" href="nosotros.html">nosotros</a></li>
<li class="laptop:pb-3"><a class="pb-2 text-gray-200 duration-500 laptop:pb-0 laptop:hover:pl-2 hover:text-verdeClaroLeaf w-fit" href="productos.html">productos</a></li>
<li class="laptop:pb-3"><a class="pb-2 text-gray-200 duration-500 laptop:pb-0 laptop:hover:pl-2 hover:text-amber-400 w-fit" href="https://leafspringmexico.mercadoshops.com.mx/">mercadoshop</a></li>
<li><a class="pb-2 text-gray-200 duration-500 laptop:pb-0 laptop:hover:pl-2 hover:text-verdeClaroLeaf w-fit" href="contacto.html">contacto</a></li>
</ul>
</div>
<div class="laptop:col-start-3 laptop:col-end-5 w-fit">
<p class="pb-1 duration-500 w-fit laptop:pb-3 hover:text-amber-400" title="contactar en WhastApp"><a href="https://wa.me/523325787385?text=Gracias por ponerte en contacto, ¿En qué te podemos ayudar?" target="_blank" aria-label="contactar mediante whatsapp"><i class="pr-2 text-base align-middle laptop:text-4xl fa-brands fa-whatsapp text-verdeClaroLeaf"></i> (33)
2578-7385</p>
<p class="pb-1 laptop:pb-3 w-fit"><i class="pr-2 text-base align-middle laptop:text-3xl fa-solid fa-phone text-verdeClaroLeaf"></i> (33)
3645-0696</p>
<p class="pb-1 laptop:pb-3 w-fit"><i class="pr-2 text-base align-middle laptop:text-3xl fa-solid fa-fax text-verdeClaroLeaf"></i> (33) 3144-8289
</p>
<p title="enviar correo a leaf spring mexico" class="tracking-wide duration-500 laptop:hover:pl-2 laptop:hover:text-yellow-400"><a href="mailto:leafspringmexico@gmail.com"><i class="pr-3 text-base align-middle duration-500 laptop:text-3xl ipad:text-lg hd:text-3xl fa-solid fa-envelope text-verdeClaroLeaf"></i>leafspringmexico@gmail.com</a>
</p>
</div>
<div class="py-0 laptop:col-span-1 small:pt-8 laptop:pt-0 laptop:col-start-5 laptop:col-end-7">
<p class="col-span-1 text-xs tracking-wide text-center laptop:text-right laptop:text-sm small:pt-8 laptop:pt-0 tablet:col-span-2 laptop:py-5 text-zinc-400 laptop:col-span-6 font-roboto">
Copyright© 2023 Leaf Spring México. Todos los derechos reservados.</p>
<div class="flex pt-10 mx-auto justify-center align-middle text-[12px] font-light tracking-wide text-center laptop:justify-end laptop:text-right laptop:text-[12px] small:pt-3 tablet:col-span-2 text-neutral-300 laptop:col-span-2 font-roboto">
<a href="https://webbygravy.com/" class="flex items-center text-offWhite">creado por:
<div>
<img src="./img/logos/webbyGravy-logo.svg" alt="webbyGravy diseño" class="p-0 ml-2 duration-300 w-28 hd:hover:translate-x-1">
</div>
</a>
</div>
</div>
</footer>
<!-- SCRIPTS -->
<script src="js/actions.js"></script>
<script defer src="js/disallow.js"></script>
<script>AOS.init();</script>
<!-- IMAGE LAZYSIZES -->
<script src="lazysizes.min.js" async=""></script>
</body>
</html>