Milhas para quem é feito de viagens
Turbine seus sonhos
Conheça mais sobre nosso programa de fidelidade e descubra algumas formas de acumular milhas mais rápido!
Mais experiências para você
Um erro ocorreu enquanto processava o modelo.
The following has evaluated to null or missing:
==> product [in template "20101#20128#3362404" at line 298, column 17]
----
Tip: If the failing expression is known to legally refer to something that's sometimes null or missing, either specify a default value like myOptionalVar!myDefault, or use <#if myOptionalVar??>when-present<#else>when-missing</#if>. (These only cover the last step of the expression; to cover the whole expression, use parenthesis: (myOptionalVar.foo)!myDefault, (myOptionalVar.foo)??
----
----
FTL stack trace ("~" means nesting-related):
- Failed at: ${product.img_mobile.getData()} [in template "20101#20128#3362404" at line 298, column 15]
----
1<style>
2 .highlight-services__container {
3 max-width: 1120px;
4 margin: 100px auto 0;
5 padding: 0px;
6 color: #ffffff;
7 gap: 24px;
8 justify-content: space-around;
9 display: flex;
10 }
11 .highlight-services__product {
12 background-repeat: no-repeat;
13 background-position: center;
14 border-radius: 16px;
15 display: flex;
16 flex-direction: column;
17 justify-content: space-between;
18 width: 552px;
19 max-height: 320px;
20 padding: 32px;
21 }
22 .highlight-services__content {
23 width: 65%;
24 }
25 .highlight-services__text-gray {
26 font-size: 20px;
27 line-height: 32px;
28 font-family:'NunitoRegular', Arial, sans-serif;
29 letter-spacing: -0.5px;
30 }
31 .highlight-services__text-highlight {
32 font-size: 20px;
33 line-height: 32px;
34 font-family: 'NunitoBold', 'Arial Bold', sans-serif;
35 letter-spacing: -0.5px;
36 }
37 .highlight-services__smiles-text {
38 font-family: 'NunitoSemiBold', sans-serif;
39 }
40 .highlight-services__title {
41 margin: 20px 0 8px;
42 font-family: 'NunitoBold', 'Arial Bold', sans-serif;
43 font-size: 20px;
44 line-height: 32px;
45 letter-spacing: -0.5px;
46 color: inherit;
47 }
48 .highlight-services__description {
49 font-size: 14px;
50 font-family:'NunitoRegular', Arial, sans-serif;
51 line-height: 1.5em;
52 margin: 0 0 20px;
53 }
54 .highlight-services__links {
55 display: flex;
56 }
57 .highlight-services__link-filled {
58 padding: 11px 16px;
59 border-radius: 16px;
60 font-size: 14px;
61 font-family: 'NunitoBold', 'Arial Bold', sans-serif;
62 line-height: 18px;
63 text-decoration: none;
64 }
65 .highlight-services__link {
66 display: block;
67 margin-left: 16px;
68 padding: 11px 16px;
69 color: inherit;
70 font-size: 14px;
71 font-weight: bold;
72 line-height:18px;
73 text-decoration: none;
74 }
75 .highlight-services__link-filled:hover {
76 color: #0f0f0e;
77 text-decoration: none;
78 }
79 .highlight-services__link:hover {
80 color: inherit;
81 text-decoration: none;
82 }
83 .highlight-services__mobile-img {
84 display: none;
85 }
86
87
88 .highlight-services__product div:last-child {
89 background-size: cover;
90
91 }
92
93 .highlight-services__container div:last-child .highlight-services__title {
94 display: table;
95 margin-bottom: 20px;
96 margin-top: 0 !important;
97 font-size: 14px;
98 font-family: 'NunitoBold', 'Arial Bold', sans-serif;
99
100
101 }
102
103
104
105 .highlight-services__container div:last-child .highlight-services__description {
106
107 font-size: 18px;
108 max-width: 250px;
109 line-height: 18px;
110 font-family: 'NunitoBold', 'Arial Bold', sans-serif;
111 margin: 0 !important;
112 padding-bottom: 20px;
113 }
114
115 .texto-legal {
116 font-size: 10px;
117 padding-top: 20px;
118 }
119
120
121
122
123 @media only screen and (max-width: 768px) {
124 .highlight-services__mobile-img {
125 display: block;
126 width: fit-content;
127 margin: auto;
128 margin-bottom: 0px;
129 }
130 .highlight-services__content{
131 width: 100%;
132 text-align: center;
133 }
134 .highlight-services__title{
135 display: none;
136 }
137 .highlight-services__container {
138 padding: 0px 24px;
139 gap: 48px;
140 }
141 .highlight-services__product {
142 width: 264px;
143 height: 304px;
144 padding: 24px 24px 0px 24px;
145 background-image: none !important;
146 justify-content: start;
147 overflow: hidden;
148 margin: 20px auto;
149 }
150 .highlight-services__links {
151 display: flex;
152 justify-content: center;
153 align-items: center;
154 }
155
156 .highlight-services__container div:last-child .highlight-services__links {
157 padding-bottom: 20px;
158 }
159
160 .highlight-services__link {
161 margin-left: 0px;
162 padding: 0px;
163 }
164 .highlight-services__text-gray,
165 .highlight-services__text-highlight {
166 letter-spacing: -0.5px;
167 }
168 .highlight-services__description{
169 font-size: 14px;
170 margin: 18px 0px;
171 }
172
173 .texto-legal {
174 font-size: 8px;
175 padding-top: 0px;
176 text-align: center;
177 }
178
179 }
180
181 @media only screen and (max-width: 624px) {
182 .highlight-services__container{
183 display: block;
184 }
185 }
186
187 @media only screen and (max-width: 500px) {
188
189 .highlight-services__content {
190 max-width: 100%;
191 }
192 .highlight-services__title {
193 font-size: 18px;
194 line-height: 26px;
195 }
196
197 .highlight-services__container div:last-child .highlight-services__title {
198
199 font-size: 14px;
200
201 }
202
203 .highlight-services__container div:last-child .highlight-services__description {
204
205 font-size: 16px;
206
207 }
208
209 }
210</style>
211<section class="highlight-services__container">
212 <#if products.getSiblings()?has_content>
213 <#list products.getSiblings() as product>
214 <div class="highlight-services__product"
215 style="
216 background-color: ${product.backgroundColor.getData()};
217 background-image: url('${product.image.getData()}')">
218 <div class="highlight-services__content">
219 <span>
220 <#assign
221 part1 = product.product.part1.getData()/>
222 <#assign
223 part2 = product.product.part2.getData()
224 />
225 <#if getterUtil.getBoolean(product.product.hasConnector.getData())>
226 <#assign
227 hasConnector = product.product.hasConnector.getData()
228 />
229 </#if>
230
231 <#if part1?has_content>
232 <span
233 id="highlight-services__part1"
234 class="highlight-services__text-gray">
235 ${part1}
236 </span>
237 <#assign part1 = {} />
238 </#if>
239 <#if hasConnector?has_content>
240 <svg
241 style="margin: 0 -5px 0; transform: translateY(5px)"
242 width="20"
243 height="25"
244 viewBox="0 0 14 4"
245 fill="none"
246 xmlns="http://www.w3.org/2000/svg">
247 <path
248 d="M13.2157 0.354916C13.2137 0.341028 13.2042 0.329816 13.1912 0.326121C13.1779 0.321534 13.1638 0.325866 13.1544 0.335804C13.1544 0.335804 13.1464 0.344723 13.1296 0.361669C13.1126 0.379124 13.0873 0.404607 13.0531 0.437352C12.9853 0.502714 12.8838 0.595852 12.7486 0.707974C12.6527 0.787606 12.5402 0.87654 12.4107 0.972226C12.4106 0.969805 12.4101 0.967639 12.41 0.965218C10.8373 2.14722 8.98818 2.67636 7.18276 2.72324C7.16747 2.72375 7.1518 2.72375 7.13651 2.72414C7.08593 2.72528 7.03522 2.7263 6.98463 2.72656C6.93494 2.72719 6.88614 2.72898 6.83582 2.72898V2.72911V2.72898C5.0746 2.72898 3.66581 2.29234 2.62894 1.79187C1.88409 1.44199 1.22588 1.00726 0.696101 0.509721C0.667306 0.48322 0.64055 0.458247 0.618763 0.437224C0.584871 0.404479 0.559516 0.378997 0.54257 0.361542C0.525879 0.344468 0.517852 0.335677 0.517598 0.335677C0.508297 0.325739 0.493899 0.321534 0.481031 0.325994C0.468035 0.329689 0.458479 0.340901 0.456567 0.354789C0.449687 0.405626 0.444336 0.470224 0.444336 0.545014V0.562215V0.567566C0.448158 0.76085 0.513011 0.909922 0.687437 1.07275C0.729611 1.11607 3.07411 3.5188 6.83594 3.51957V3.51893V3.51957C10.5978 3.51893 12.9425 1.11607 12.9847 1.07275C13.1593 0.909922 13.2241 0.760722 13.2277 0.567566V0.562215V0.545014C13.2276 0.470224 13.2228 0.405626 13.2157 0.354916Z"
249 fill="white"
250 />
251 </svg>
252 <#assign hasConnector = {} />
253 </#if>
254 <#if part2?has_content>
255 <span
256 id="highlight-services__part2"
257 class="highlight-services__text-highlight">
258 ${part2}
259 </span>
260 <#assign part2 = {} />
261 </#if>
262 </span>
263 <h2 class="highlight-services__title">
264 ${product.title.getData()}
265 </h2>
266 <p class="highlight-services__description">
267 ${product.description.getData()}
268 </p>
269 </div>
270 <div class="highlight-services__links">
271 <a
272 href="${product.buttonLink.getData()}"
273 class="highlight-services__link-filled"
274 target="_blank"
275 rel="noopener"
276 style="background-color: ${product.bg_cta.getData()}; color: ${product.fonte_cta.getData()};"
277 > ${product.buttonLabel.getData()} </a>
278 <!-- <#if product.refLabel.getSiblings()?has_content>
279 <a
280 href="${product.refLink.getData()}"
281 class="highlight-services__link"
282 target="_blank"
283 rel="noopener"
284 > ${product.refLabel.getData()} </a>
285 </#if> -->
286 </div>
287 <#if product.refLabel.getSiblings()?has_content>
288 <p class="texto-legal">${product.refLabel.getData()}</p>
289 </#if>
290 </div>
291 </#list>
292 </#if>
293</section>
294
295<script>
296 console.log('oi');
297 console.log(product.image.getData());
298 console.log(${product.img_mobile.getData()});
299
300// function trocarBackground() {
301// const boxImage = document.querySelector('.highlight-services__product');
302
303// if (window.innerWidth < 768) {
304// boxImage.style.backgroundImage = "url('${product.image.getData()}')";
305// } else {
306// boxImage.style.backgroundImage = "url('${product.img_mobile.getData()}')";
307// }
308// }
309
310// // Executa ao carregar
311// trocarBackground();
312
313// // Executa ao redimensionar
314// window.addEventListener('resize', trocarBackground);
315
316</script>
Como comprar passagens aéreas com Milhas
Viajar com a Smiles ficou muito mais fácil! Se você já tem férias planejadas, mas ainda faltam milhas para completar a compra das passagens aéreas, você está no lugar certo! Na Smiles você pode combinar milhas e dinheiro na emissão dos seus bilhetes para garantir a viagem dos sonhos. Acumule pontos usando seu cartão de crédito nas compras do dia a dia e troque por milhas para a sua próxima aventura!