Luxembourg
16 Boulevard Royal – L-2449 Luxembourg
 
Monday to Friday
8 am to 5 pm
An error occurred while processing the template.
The following has evaluated to null or missing:
==> ART_CONTENU  [in template "10157#10197#205341" at line 14, column 20]

----
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: #assign contenu = ART_CONTENU.getData()  [in template "10157#10197#205341" at line 14, column 1]
----
1<#assign serviceContext = staticUtil["com.liferay.portal.kernel.service.ServiceContextThreadLocal"].getServiceContext()> 
2<#assign journalArticleLocalService = serviceLocator.findService("com.liferay.journal.service.JournalArticleLocalService") /> 
3<#assign themeDisplay = serviceContext.getThemeDisplay() /> 
4<#assign site_groupid = themeDisplay.getLayout().getGroupId() /> 
5 
6<#assign originalImageUrl = ""> 
7<#if ART_IMAGE?has_content> 
8	<#assign originalImageUrl = ART_IMAGE.getData()> 
9</#if> 
10<#assign imageUrl = fileEntryUtil.getImageUrlByFormat(groupId, originalImageUrl, "liste")> 
11 
12<#assign GroupLocalService = serviceLocator.findService("com.liferay.portal.kernel.service.GroupLocalService")> 
13 
14<#assign contenu = ART_CONTENU.getData()> 
15 
16<#-- gestion de la date - DEBUT --> 
17<#assign date_publication = .vars['reserved-article-display-date'].data> 
18<#assign originalLocale = locale> 
19<#setting locale = localeUtil.getDefault()> 
20<#assign date_publication = date_publication?datetime("EEE, d MMM yyyy HH:mm:ss Z")> 
21<#assign locale = originalLocale> 
22<#setting locale = originalLocale> 
23<#assign langue = locale?substring(0,locale?last_index_of("_"))> 
24<#assign langueDateDot = ""> 
25<#if langue == "de"><#assign langueDateDot = "."></#if> 
26<#assign title = .vars['reserved-article-title'].data> 
27<#if title?ends_with(" ?")><#assign title = title?substring(0 , title?length - 2) + "&nbsp;?"></#if> 
28<#if title?ends_with(" !")><#assign title = title?substring(0 , title?length - 2) + "&nbsp;!"></#if> 
29<#-- gestion de la date - FIN --> 
30 
31<#assign assetEntryLocalService = serviceLocator.findService("com.liferay.asset.kernel.service.AssetEntryLocalService") /> 
32 
33<#assign journalArticleId = .vars['reserved-article-id'].data> 
34<#assign journalArticleResourceLocalServiceUtil = staticUtil["com.liferay.journal.service.JournalArticleResourceLocalServiceUtil"]> 
35<#assign articleResourcePK = journalArticleResourceLocalServiceUtil.getArticleResourcePrimKey(groupId, journalArticleId)/> 
36<#assign asset = assetEntryLocalService.getEntry('com.liferay.journal.model.JournalArticle', articleResourcePK) > 
37 
38<#assign main_group = GroupLocalService.getGroup(site_groupid)/> 
39<#assign main_group_short_name = main_group.getFriendlyURL() /> 
40<#assign authorsFolder = main_group.getExpandoBridge().getAttribute("FOLDER_AUTHORS")/> 
41 
42<#assign rechercheParTagURL = languageUtil.get(locale,"recherche-par-tag-url")> 
43 
44<#assign artAuteur = ""> 
45<#if  ART_AUTEUR?has_content && ART_AUTEUR.getData() != ""  && ART_AUTEUR.getData() != "vide"> 
46	<#assign artAuteur = authorArticle.ajustAuthor(ART_AUTEUR.getData(),themeDisplay)> 
47</#if> 
48 
49<#assign readTime = articleUtil.getReadTime(ART_CHAPO.getData(),contenu)/> 
50 
51<#assign VisibleDetail = ILLUSTRATION_ANIMEEFieldSet.VisibleDetail?has_content && getterUtil.getBoolean(ILLUSTRATION_ANIMEEFieldSet.VisibleDetail.getData())> 
52<#assign hasAnimatedIllustration = ILLUSTRATION_ANIMEEFieldSet.ILLUSTRATION_ANIMEE?has_content && ILLUSTRATION_ANIMEEFieldSet.ILLUSTRATION_ANIMEE.getData()!="" && VisibleDetail> 
53 
54 
55<#if main_group_short_name == "/bl"> 
56    <#assign cropimage = "Centre"> 
57    <#if CROP_IMAGE?has_content> 
58        <#assign cropimage = CROP_IMAGE.getData()> 
59    </#if> 
60    <#if cropimage == "Gauche"><#assign cropimage = "25%"></#if> 
61    <#if cropimage == "Droite"><#assign cropimage = "75%"></#if> 
62    <#if cropimage == "Centre"><#assign cropimage = "center"></#if> 
63    <div class="section image-bg-header ca3-scroll-down-arrow-ok" style="background-color:black;background-image:url(${originalImageUrl});background-position: ${cropimage} center;"> 
64        <#if hasAnimatedIllustration> 
65            <video autoplay="" class="videofullscreen" data-autoplay="" muted="" playsinline="" poster="${originalImageUrl}" webkit-playsinline=""><source src="${ILLUSTRATION_ANIMEEFieldSet.ILLUSTRATION_ANIMEE.getData()}" type="video/mp4"/></video> 
66        </#if> 
67        <div class="image_overlay_dark"></div> 
68            <div class="layer"> 
69                <div class="article-meta-line"> 
70                    <div class="real-date">${date_publication?string.dd}${langueDateDot} ${date_publication?string.MMMM} ${date_publication?string.yyyy}</div> 
71                    <div class="withmiddot"><span>&middot;</span></div> 
72                    <div class="read-time"><img src="/o/blu-theme/images/picto/clock-white.svg" class="clock" loading="lazy" width="18" height="18" style="margin-right:6px;margin-bottom:3px;" alt="${languageUtil.get(locale,"blu.temps.lecture")}"/> ${readTime} min</div> 
73                </div> 
74                <h1 class="blog-detail">${title}</h1> 
75                <div class="article-meta-line authors"> 
76                    <#if artAuteur != ""  && artAuteur != "vide"> 
77                        <#assign authorsIMG = authorArticle.getAuthorImg(artAuteur,authorsFolder)> 
78                        <#list authorsIMG as authorIMG> 
79                            <img src="${authorIMG}" width="32" height="32" class="author" alt="${artAuteur}"/> 
80                        </#list> 
81                        ${artAuteur} 
82                    </#if> 
83                </div> 
84                <div class="article-meta-line tags"> 
85                    <#list asset.getTags() as tag> 
86                        <#if tag.name?starts_with("topic_")> 
87                            <a class="hashtag-hash" href="/${langue}/bank${main_group_short_name}/${rechercheParTagURL}/-/filter/tag/${tag.name}">${languageUtil.get(locale,tag.name)}</a> 
88                        </#if> 
89                    </#list> 
90                </div> 
91            </div> 
92        </div> 
93    </div> 
94    <div class="article-wrapper"> 
95        <p class="chapo">${ART_CHAPO.getData()}</p> 
96 
97        ${contenu} 
98        <#if  artAuteur != ""  && artAuteur != "vide"> 
99            <#assign auteurxml = authorArticle.get(articleGroupId, artAuteur, locale)> 
100            <#if auteurxml?? && auteurxml!=''> 
101                <div class="trait-auteur"></div> 
102                <div class="blog-detail-auteur"> 
103                        ${saxReaderUtil.read(auteurxml).valueOf("//dynamic-content/text()")} 
104                </div> 
105            </#if> 
106        </#if> 
107        <div class="topic-tags"> 
108            <#list asset.getTags() as tag> 
109                <#if tag.name?starts_with("topic_")> 
110                    <a class="topic_tag" href="/${langue}/bank${main_group_short_name}/${rechercheParTagURL}/-/filter/tag/${tag.name}"> 
111                        ${languageUtil.get(locale,tag.name)} 
112                    </a> 
113                </#if> 
114            </#list> 
115        </div> 
116    </div> 
117 
118    <div class="addthis_sharing_toolbox"></div> 
119 
120    <script> 
121        $(document).ready(function() { 
122            init_topScreen(); 
123            return; 
124            <#assign blocDate = '<div class="article-meta-line"><div class="real-date">${date_publication?string.dd}${langueDateDot} ${date_publication?string.MMMM} ${date_publication?string.yyyy}</div>'> 
125            <#assign blocDate = blocDate + '<div class="withmiddot"><span>&middot;</span></div><div class="read-time"><img src="/o/blu-theme/images/picto/clock-white.svg" class="clock" loading="lazy" width="18" height="18" style="margin-right:6px;margin-bottom:3px;" alt="${languageUtil.get(locale,"blu.temps.lecture")}"/> ${readTime} min</div></div>'/> 
126 
127            <#assign blocTags = '<div class="article-meta-line tags">'> 
128            <#list asset.getTags() as tag> 
129                <#if tag.name?starts_with("topic_")> 
130                    <#assign blocTags = blocTags + ' <a class="hashtag-hash" href="/${langue}/bank${main_group_short_name}/${rechercheParTagURL}/-/filter/tag/${tag.name}">${languageUtil.get(locale,tag.name)}</a>'> 
131                </#if> 
132            </#list> 
133            <#assign blocTags = blocTags + '</div>'> 
134 
135            <#assign blocAuteurs = '<div class="article-meta-line authors">'> 
136            <#if artAuteur != ""  && artAuteur != "vide"> 
137                <#assign authorsIMG = authorArticle.getAuthorImg(artAuteur,authorsFolder)> 
138                <#list authorsIMG as authorIMG> 
139                    <#assign blocAuteurs = blocAuteurs + '<img src="${authorIMG}" width="32" height="32" class="author"  alt="${artAuteur}"/>'> 
140                </#list> 
141 
142                <#assign authorClean = artAuteur?replace("'", "&apos;")> 
143                <#assign blocAuteurs = blocAuteurs + ' ${authorClean}'> 
144            </#if> 
145            <#assign blocAuteurs = blocAuteurs + '</div>'> 
146 
147            <#assign titleClean = title?replace("'", "&apos;")> 
148            <#assign blocH1 = '<div class="image_overlay_dark"></div><div class="layer">${blocDate}<h1 class="blog-detail">${titleClean}</h1>${blocAuteurs}${blocTags}</div></div>'> 
149 
150            $('.fullpage').prepend('<div class="section image-bg-header ca3-scroll-down-arrow-ok" style="background-image:url(${originalImageUrl});display:none;">${blocH1}</div>'); 
151            <#if hasAnimatedIllustration> 
152                $('.fullpage .section.image-bg-header').html('<video autoplay="" class="videofullscreen" data-autoplay="" muted="" playsinline="" poster="${originalImageUrl}" webkit-playsinline=""><source src="${ILLUSTRATION_ANIMEEFieldSet.ILLUSTRATION_ANIMEE.getData()}" type="video/mp4"/></video>${blocH1}'); 
153            </#if> 
154            $('.fullpage .section.image-bg-header').show(); 
155        }); 
156 
157    </script> 
158 
159    <#if main_group_short_name == "/bl"> 
160        <div id="nl-subscription" class="blu-times-nl form_newsletter style2" style="display:none;"> 
161            <div class="form_newsletter_content"> 
162                <div class="form_newsletter_content_img"></div> 
163                <div class="form_newsletter_content_form"> 
164                    <div class="form_newsletter_text">${languageUtil.get(locale,"nl.abonnez.vous")}</div> 
165                    <#if main_group_short_name == "/bl"> 
166                        <a style="display:none !important;" class="only-lu only-de only-europe only-autres" href="/${langue}/bank/bl/newsletter-lu">${languageUtil.get(locale,"nl.consultez")}</a> 
167                        <a style="display:none !important;" class="only-be" href="/${langue}/bank/bl/newsletter-be">${languageUtil.get(locale,"nl.consultez")}</a> 
168                        <div style="font-family:'Poppins Medium';font-size:16px;line-height:24px;font-weight: 400;" 
169                                class="form_newsletter_text">${languageUtil.get(locale,"nl.text")}</div> 
170                    </#if> 
171                    <div class="form_newsletter_form"> 
172                    <div class="newsletter"> 
173                        <label id="searchLabel" for="nl_email" class="sr-only">${languageUtil.get(locale,"nl.abonnez.vous")}</label> 
174                        <input placeholder="${languageUtil.get(locale,"nl.e.mail")}" type="text" id="nl_email"/> 
175                        <a id="nl-link-form" onclick="cook();" data-featherlight="iframe" 
176                            <#if main_group_short_name == "/bl"> 
177                                href="/${langue}${languageUtil.get(locale,"nl.url-form-bl")}" 
178                            </#if> 
179                        > <div>${languageUtil.get(locale,"nl.s.inscrire")}</div> </a> 
180                        </div> 
181                    </div> 
182                    <a class="close-nl" href="#" onclick="return cook();">X</a> 
183                </div> 
184            </div> 
185        </div> 
186 
187        <script> 
188            <#assign cur_url = portalUtil.getCurrentCompleteURL(serviceContext.getRequest())> 
189            <#if !cur_url?contains("source=newsmail") && !cur_url?contains("source=blwebsites")> 
190                jQuery(document).ready(function() { 
191                    if(typeof jQuery.cookie('NL_SUBSCRIPTION_HIDE') == 'undefined') { 
192                        setTimeout(function() { jQuery('#nl-subscription').show();}, 10000); 
193
194                }); 
195            </#if> 
196 
197            function cook() { 
198                jQuery.cookie('NL_SUBSCRIPTION_HIDE', 'true', { expires:100, path: '/' }); 
199                jQuery('#nl-subscription').hide(); 
200                return false; 
201
202 
203            jQuery("#nl_email").change(function() { 
204                jQuery('#nl-link-form').attr('href',jQuery('#nl-link-form').attr('href').substr(0, jQuery('#nl-link-form').attr('href').indexOf('&EMAIL=')) + '&EMAIL=' + jQuery("#nl_email").val()); 
205            }); 
206        </script> 
207    </#if> 
208</#if> 
209 
210<#if main_group_short_name == "/bli"> 
211    <#assign titleClean = title?replace("'", "&apos;")> 
212        <div class="article-wrapper" id="movemeblog" style="padding-top:0;"> 
213            <nav class="bl-breadcrumb" role="navigation"> 
214                <a href="/"><@liferay.language key="homepage"/></a> > 
215                <#assign ancestors = themeDisplay.getLayout().getAncestors()> 
216                <#if ancestors?has_content> 
217                    <#assign reversedAncestors = ancestors?reverse> 
218                    <#list reversedAncestors as ancestor> 
219                        <a href="/${langue}/bank${main_group_short_name}${ancestor.getFriendlyURL(locale)}">${ancestor.getName(locale)}</a> > 
220                  </#list> 
221                </#if> 
222                <span>${titleClean}</span> 
223            </nav> 
224            <bdl-bds-grid-layout margin-bottom-8 margin-top-4 style="margin-left:calc(var(--gutter-default) * -2);margin-right:calc(var(--gutter-default) * -6);"> 
225              <bdl-bds-grid-layout-item xlg-6 lg-6 md-6 sm-8 xs-4 xxs-4 style="margin-left:0;"> 
226                <section style="height: 100%"> 
227                  <bdl-bds-card no-padding no-background no-border border-radius="calc(var(--gutter-default) * 2)"> 
228                    <div slot="card-content" border-radius-2> 
229                      <div class="title-zone"> 
230                        <div display-flex justify-content-start align-items-center> 
231                            <#list asset.getTags() as tag> 
232                                <#if tag.name?starts_with("topic_")> 
233                                    <bdl-bds-badge size="lg" margin-right-2 
234                                        <#if ("topic_highlights" == tag.name)> styles="primary-300" </#if> 
235                                        <#if ("topic_perspectives" == tag.name)> styles="tertiary-700" </#if> 
236                                        <#if ("topic_article" == tag.name)> styles="primary-900" </#if> 
237                                        text="${languageUtil.get(locale,tag.name)}"> 
238                                    </bdl-bds-badge> 
239                                </#if> 
240                            </#list> 
241                          <div display-flex justify-content-start align-items-center> 
242                            <bdl-bds-icon icon="calendar" styles="secondary-900" size="3X"></bdl-bds-icon> 
243                            <bdl-bds-typography style="margin-left: calc(var(--gutter-default) * .5);" font-type="body2" 
244                              styles="secondary-900" font-weight="light">${date_publication?string.dd}${langueDateDot} ${date_publication?string.MMMM} ${date_publication?string.yyyy}</bdl-bds-typography> 
245                            <bdl-bds-icon margin-left-1 icon="clock" styles="primary-700" size="3X"></bdl-bds-icon> 
246                            <bdl-bds-typography style="margin-left: calc(var(--gutter-default) * .5);" font-type="body2" 
247                              styles="primary-700" font-weight="bold">${readTime} min</bdl-bds-typography> 
248                          </div> 
249                        </div> 
250                        <bdl-bds-typography margin-top-2 font-type="h1" 
251                          styles="primary-700" font-weight="bold" content="${titleClean}"></bdl-bds-typography> 
252                        <#if ILLUSTRATION_ANIMEEFieldSet.ILLUSTRATION_ANIMEE?has_content && ILLUSTRATION_ANIMEEFieldSet.ILLUSTRATION_ANIMEE.getData()!="" > 
253                            <bdl-bds-button margin-top-1 class="article-download btn_to_expand" styles="default" size="sm" border-squared 
254                              content="<@liferay.language key="bli.news.download"/>" 
255                              onclick="window.open('${ILLUSTRATION_ANIMEEFieldSet.ILLUSTRATION_ANIMEE.getData()}', '_blank');return false;"> 
256                            </bdl-bds-button> 
257                        </#if> 
258                      </div> 
259                          <section style="height: auto" class="img-smartphone"> 
260                            <bdl-bds-card no-padding no-background no-border border-radius="calc(var(--gutter-default) * 2)"> 
261                              <div slot="card-content" border-radius-2> 
262                                <div style="position: relative; height: calc(var(--gutter-default) * 60); padding: calc(var(--gutter-default) * 2); border-radius: calc(var(--gutter-default) * 2); background-color: var(--color-white); overflow: hidden"> 
263                                  <div style="position: relative;height: 100%;border-radius: calc(var(--gutter-default) * 2);border: calc(var(--gutter-default)) solid var(--color-primary-100); 
264                                    background-color: var(--color-primary-200);background-position: center;background-size: cover;background-repeat: no-repeat; 
265                                    background-image:url('${imageUrl}');overflow: hidden;"></div> 
266                                </div> 
267                              </div> 
268                            </bdl-bds-card> 
269                          </section> 
270                        <#assign lesAuteurs = artAuteur /> 
271                        <#assign maListeAuteurs = lesAuteurs?split(" & ") /> 
272                        <#assign folderId = 10806076 /> 
273                        <#assign articlesInFolder = journalArticleLocalService.getArticles(site_groupid, folderId, -1, -1) /> 
274                        <bdl-bds-grid-layout class="article-title-auteur"> 
275                            <#list maListeAuteurs as articleTitleAuteur> 
276                                <#assign myArticleAuteur = "" /> 
277                                <#list articlesInFolder as article> 
278                                    <#if article.getTitle(locale)?lower_case == articleTitleAuteur?lower_case> 
279                                        <#assign myArticleAuteur = journalArticleLocalService.getLatestArticle(site_groupid, article.getArticleId()) /> 
280                                        <#break> 
281                                    </#if> 
282                                </#list> 
283                                <#if myArticleAuteur?has_content && myArticleAuteur?is_hash> 
284                                    <#assign document = saxReaderUtil.read(myArticleAuteur.getContentByLocale(themeDisplay.getLocale().getLanguage() + "_"+themeDisplay.getLocale().getCountry())) /> 
285                                    <#assign root = document.getRootElement() /> 
286                                    <#assign poste = root.valueOf("//dynamic-element[@name='POSTE']/dynamic-content/text()")> 
287                                    <#assign link = articleUtil.getPageURL(site_groupid,myArticleAuteur.getArticleId(),themeDisplay) /> 
288                                    <#assign link = link?substring(link?last_index_of("/")) /> 
289 
290                                    <#assign imageUrlAuteur="" /> 
291                                    <#assign photoValue = root.valueOf("//dynamic-element[@name='PHOTO']/dynamic-content/text()") /> 
292                                    <#if photoValue?? && (photoValue?length > 5)> 
293                                        <#assign imageUrlAuteur = fileEntryUtil.getImageUrlByFormat(site_groupid, photoValue, "vignette", false)> 
294                                    </#if> 
295 
296                                    <bdl-bds-grid-layout-item xlg-6 lg-6 md-6 sm-4 xs-4 xxs-4 class="bdl-bds-card-contact__grid" 
297                                        onClick="document.location.href='/${langue}/bank${main_group_short_name}${link}';return false;"> 
298                                        <bdl-bds-card no-padding="" no-border="" class="bdl-bds-card-contact"> 
299                                            <div slot="card-content" display-flex="" justify-content-flex-start=""> 
300                                                <div style="padding:24px 16px 24px 24px;"> 
301                                                    <div display-flex justify-content-start align-items-start gap-1> 
302                                                        <bdl-bds-avatar elevation-level="0" rounded="" src="${imageUrlAuteur}" size="lg" text="${articleTitleAuteur}"></bdl-bds-avatar> 
303                                                        <div flex-1> 
304                                                            <bdl-bds-typography font-type="h4" styles="tertiary-700" font-weight="bold" content="${articleTitleAuteur}"></bdl-bds-typography> 
305                                                            <bdl-bds-typography font-type="body2" styles="secondary" font-weight="light" content="${poste}" style="text-align:left;"></bdl-bds-typography> 
306                                                        </div> 
307                                                        <bdl-bds-button styles="default" size="default" text-only="" squared="" class="bdl-bds-card-contact__button" 
308                                                            onClick="document.location.href='/${langue}/bank${main_group_short_name}${link}';return false;"> 
309                                                            <bdl-bds-icon slot="icon" icon="chevron-right" size="3x"> </bdl-bds-icon> 
310                                                        </bdl-bds-button> 
311                                                    </div> 
312                                                </div> 
313                                            </div> 
314                                        </bdl-bds-card> 
315                                    </bdl-bds-grid-layout-item> 
316                                </#if> 
317                            </#list> 
318                        </bdl-bds-grid-layout> 
319                    </div> 
320                  </bdl-bds-card> 
321                </section> 
322              </bdl-bds-grid-layout-item> 
323              <bdl-bds-grid-layout-item xlg-6 lg-6 md-6 sm-8 xs-4 xxs-4 style="margin-right:calc(var(--gutter-default) * -2);" class="img-not-smartphone"> 
324                <section style="height: auto"> 
325                  <bdl-bds-card no-padding no-background no-border border-radius="calc(var(--gutter-default) * 2)"> 
326                    <div slot="card-content" border-radius-2> 
327                      <div style="position: relative; height: calc(var(--gutter-default) * 60); padding: calc(var(--gutter-default) * 2); border-radius: calc(var(--gutter-default) * 2); background-color: var(--color-white); overflow: hidden"> 
328                        <div style="position: relative;height: 100%;border-radius: calc(var(--gutter-default) * 2);border: calc(var(--gutter-default)) solid var(--color-primary-100); 
329                          background-color: var(--color-primary-200);background-position: center;background-size: cover;background-repeat: no-repeat; 
330                          background-image:url('${originalImageUrl}');overflow: hidden;"></div> 
331                      </div> 
332                    </div> 
333                  </bdl-bds-card> 
334                </section> 
335              </bdl-bds-grid-layout-item> 
336            </bdl-bds-grid-layout> 
337        </div> 
338    <script> 
339        document.body.classList.add('bli-big-header-page'); 
340        $('#layout-column_column-1').prepend($('#movemeblog').first().detach()); 
341        document.querySelectorAll('.article-download').forEach(btn => { 
342            try { btn.trailingMedia = [{ type:'icon', icon:'download', size:'3x' }]; } catch(e) {} 
343        }); 
344    </script> 
345   <section class="transparent-card BLI_BLOG" id="item-blogpost"> 
346        <bdl-bds-container z-index="1" position-relative> 
347            <bdl-bds-card no-padding border-radius="calc(var(--gutter-default) * 2)" margin-bottom-8> 
348                <div slot="card-content" border-radius-2> 
349                    <div style="padding: 32px"> 
350 
351                          <bdl-bds-card no-padding="" no-border="" no-background="" margin-bottom-4="" class="radius-1-smartphone"> 
352                            <div slot="card-content" background-color="primary-800" border-radius-2="" style="border-radius: calc(var(--gutter-default) * 2);border: 1px solid var(--color-secondary-400);"> 
353                              <bdl-bds-typography class="h3_h4 scrollspyme" padding-left-4="" padding-right-4="" padding-top-2="" padding-bottom-2="" 
354                                                    font-type='h3' styles="secondary-100" font-weight="extra-bold" content="${languageUtil.get(locale,"topic_article")}"> 
355                              </bdl-bds-typography> 
356                            </div> 
357                          </bdl-bds-card> 
358 
359                        <p class="chapo">${ART_CHAPO.getData()}</p> 
360                        <div class="content-bli-article">${contenu}</div> 
361                        <div class="content-bli-article-show-hide-more" onclick="showMore();" style="cursor:pointer;margin-top: 16px;"> 
362                            ${languageUtil.get(locale,"bli.news.voir-plus")} 
363                            <bdl-bds-icon icon="arrow-down" styles="secondary-900" size="3X" style="margin-left:12px;vertical-align:text-bottom;"></bdl-bds-icon> 
364                        </div> 
365                        <div class="content-bli-article-show-hide-less" onclick="showLess();" style="cursor:pointer;margin-top: 16px;"> 
366                            ${languageUtil.get(locale,"bli.news.voir-moins")} 
367                            <bdl-bds-icon icon="arrow-up" styles="secondary-900" size="3X" style="margin-left:12px;vertical-align:text-bottom;"></bdl-bds-icon> 
368                        </div> 
369                    </div> 
370                </div> 
371            </bdl-bds-card> 
372        </bdl-bds-container> 
373    </section> 
374    <style> 
375        .content-bli-article-show-hide-more {display:none;} 
376        .content-bli-article-show-hide-less {display:none;} 
377    </style> 
378    <script> 
379        function showMore() { 
380            $('.content-bli-article-show-hide-more').hide(); 
381            $('.content-bli-article-show-hide-less').show(); 
382            $('.content-bli-article').addClass("show-all"); 
383
384        function showLess() { 
385            $('.content-bli-article-show-hide-more').show(); 
386            $('.content-bli-article-show-hide-less').hide(); 
387            $('.content-bli-article').removeClass("show-all"); 
388            setTimeout(function() { 
389              $('html, body').animate({ 
390                scrollTop: $('.content-bli-article-show-hide-more').offset().top - 200 
391              }, 400); 
392            }, 100); 
393
394    </script> 
395    <#if (VIDEO_ID_YOUTUBE?has_content && VIDEO_ID_YOUTUBE.getData()!="") || (AUSHAPARAMS?has_content && AUSHAPARAMS.getData()!="")> 
396        <style> 
397            .content-bli-article { 
398                max-height:40vh; 
399                overflow:hidden; 
400
401            .content-bli-article.show-all { 
402                max-height:none; 
403
404            .content-bli-article-show-hide-more {display:block;} 
405        </style> 
406    </#if> 
407    <#if VIDEO_ID_YOUTUBE?has_content && VIDEO_ID_YOUTUBE.getData()!="" > 
408        <section class="transparent-card BLI_BLOG" id="item-blogpost-video"> 
409            <bdl-bds-container z-index="1" position-relative> 
410                <bdl-bds-card no-padding border-radius="calc(var(--gutter-default) * 2)" margin-bottom-8> 
411                    <div slot="card-content" border-radius-2> 
412                        <div style="padding: 32px"> 
413 
414                              <bdl-bds-card no-padding="" no-border="" no-background="" margin-bottom-4="" class="radius-1-smartphone"> 
415                                <div slot="card-content" background-color="primary-800" border-radius-2="" style="border-radius: calc(var(--gutter-default) * 2);border: 1px solid var(--color-secondary-400);"> 
416                                  <bdl-bds-typography class="h3_h4 scrollspyme" padding-left-4="" padding-right-4="" padding-top-2="" padding-bottom-2="" 
417                                                        font-type='h3' styles="secondary-100" font-weight="extra-bold" content="${languageUtil.get(locale,"bli.news.video")}"> 
418                                  </bdl-bds-typography> 
419                                </div> 
420                              </bdl-bds-card> 
421 
422                                <div class="video-container"> 
423                                    <div class="youtube_player" height="315" rel="0" videoid="${VIDEO_ID_YOUTUBE.getData()}" width="560">&nbsp;</div> 
424                                </div> 
425                                <style> 
426                                    .video-container {border-radius:16px;} 
427                                    @media (max-width: 1151px) { 
428                                        .video-container {border-radius:8px;} 
429
430                                </style> 
431                        </div> 
432                    </div> 
433                </bdl-bds-card> 
434            </bdl-bds-container> 
435        </section> 
436    </#if> 
437    <#if AUSHAPARAMS?has_content && AUSHAPARAMS.getData()!="" > 
438        <section class="transparent-card BLI_BLOG" id="item-blogpost-audio"> 
439            <bdl-bds-container z-index="1" position-relative> 
440                <bdl-bds-card no-padding border-radius="calc(var(--gutter-default) * 2)" margin-bottom-8> 
441                    <div slot="card-content" border-radius-2> 
442                        <div style="padding: 32px"> 
443 
444                              <bdl-bds-card no-padding="" no-border="" no-background="" margin-bottom-4="" class="radius-1-smartphone"> 
445                                <div slot="card-content" background-color="primary-800" border-radius-2="" style="border-radius: calc(var(--gutter-default) * 2);border: 1px solid var(--color-secondary-400);"> 
446                                  <bdl-bds-typography class="h3_h4 scrollspyme" padding-left-4="" padding-right-4="" padding-top-2="" padding-bottom-2="" 
447                                                        font-type='h3' styles="secondary-100" font-weight="extra-bold" content="${languageUtil.get(locale,"bli.news.audio")}"> 
448                                  </bdl-bds-typography> 
449                                </div> 
450                              </bdl-bds-card> 
451 
452                                <div aushaparams="${AUSHAPARAMS.getData()}" class="ausha_player" height="420"> 
453                                    &nbsp; 
454                                </div> 
455 
456                        </div> 
457                    </div> 
458                </bdl-bds-card> 
459            </bdl-bds-container> 
460        </section> 
461    </#if> 
462   <#-- <script> 
463        try { 
464            setTimeout(function () {addToScrollSpyTargets();}, 1000); 
465        } catch(error) {} 
466    </script>--> 
467    <style> 
468        html.aui.theme_blu body.view-bli-app { 
469            & .article-wrapper .BLI_BLOG { 
470                p.chapo { 
471                    font-size: var(--typography-h5-font-size); 
472                    line-height: var(--typography-h5-line-height); 
473
474                 p, span, div, ul, ul li, ol, ol li { 
475                     font-size: var(--typography-h6-font-size); 
476                     line-height: var(--typography-h6-line-height); 
477
478                 h2, h3, h4 { 
479                    font-size: var(--typography-h5-font-size); 
480                    line-height: var(--typography-h5-line-height); 
481                    margin-bottom:calc(var(--gutter-default) * 2); 
482                    color: var(--color-tertiary-700); 
483
484                 h3, h4 { 
485                      font-size: var(--typography-h6-font-size); 
486                      line-height: var(--typography-h6-line-height); 
487                      margin-bottom:calc(var(--gutter-default) * 1); 
488
489                  .h3_h4  { 
490                    h2, h3, h4 { 
491                        color: var(--color-secondary-100) !important; 
492
493
494 
495
496
497 
498            .view-bli-app .article-title-auteur h4 { 
499               margin:0 !important; 
500
501            .view-bli-app ul li, .view-bli-app ol li { 
502               text-align:left !important; 
503
504            .bli-big-header-page .view-bli-app__header { 
505                height: calc(var(--gutter-default) * 92) !important; 
506
507            #content { 
508                margin-top: calc(var(--gutter-default) * -72) !important; 
509
510 
511            .view-bli-app #main-section { 
512                margin-right: calc(var(--gutter-default) * -4); 
513
514            .view-bli-app  #scrollspy-targets { 
515                margin-left:0; 
516                margin-right:0; 
517
518 
519            .view-bli-app  #scrollspy-targets .influx-portlet  { 
520                margin-left: calc(var(--gutter-default) * 2); 
521                margin-right: calc(var(--gutter-default) * 2); 
522
523            .view-bli-app.bli-big-header-page { 
524                h1, p.chapo { 
525                    max-width:100% 
526
527
528            .view-bli-app .view-bli-app__header { 
529                overflow: hidden; 
530                position: relative; 
531                background-repeat: no-repeat; 
532                background-color: var(--color-primary-200); 
533                background-size: cover; 
534                background-position: center; 
535                background-image:none; 
536
537            .view-bli-app .view-bli-app__header:after { 
538                position: absolute; 
539                display: block; 
540                content: ""; 
541                width: 250vw; 
542                top: 0; 
543                left: -75vw; 
544                height: 100%; 
545                background-color: transparent; 
546                background-position: center; 
547                background-size: initial; 
548                background-repeat: no-repeat; 
549                background-image: url("/documents/d/bli/bli-big-pattern"); 
550                z-index: 0; 
551
552 
553            .view-bli-app .title-zone { 
554                padding: 0 calc(var(--gutter-default) * 4); 
555                display: flex; 
556                align-items: flex-start; 
557                flex-direction: column; 
558                justify-content: center; 
559                height: 100%; 
560
561           .img-not-smartphone { 
562                display:block; 
563
564            .img-smartphone { 
565                display:none; 
566
567 
568            @media (max-width : 1151px) { 
569                .view-bli-app #content { 
570                    margin-top: calc(var(--gutter-default) * -85) !important; 
571
572                .view-bli-app .bl-breadcrumb + bdl-bds-grid-layout { 
573                    margin-left: calc(var(--gutter-default) * 2) !important; 
574                    margin-right: calc(var(--gutter-default) * -2) !important; 
575
576                .view-bli-app .title-zone { 
577                    padding: 0 0 0 calc(var(--gutter-default) * 2); 
578
579                .bdl-bds-card-contact__grid { 
580                    max-width:100%; 
581
582
583            @media (max-width : 863px) { 
584                .img-not-smartphone { 
585                    display:none; 
586
587                .view-bli-app .title-zone { 
588                    padding:0; 
589
590                .img-smartphone { 
591                    display:block; 
592                    margin-top: calc(var(--gutter-default) * 4); 
593
594                .view-bli-app .bl-breadcrumb + bdl-bds-grid-layout { 
595                    margin-left: calc(var(--gutter-default)) !important; 
596
597
598 
599    </style> 
600</#if> 
601 
602<style>.tac_activate.tac_activate_addthis { display: none !important; }</style>