Navigation Menu
Language Selector
- en (ENGLISH)
- el (ΕΛΛΗΝΙΚΑ)
test
An error occurred while processing the template.
The following has evaluated to null or missing: ==> BackgroundImageDesktop [in template "20116#20152#711321" at line 33, column 34] ---- Tip: If the failing expression is known to be 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: ${BackgroundImageDesktop.getData()} [in template "20116#20152#711321" at line 33, column 32] ----
1<style>
2
3 .red{
4 color: #eb2d32;
5 }
6
7 .terms_btn{
8 font-size: 11px !important;
9 font-family: "OpapMediumItalic";
10 color: rgb(255, 255, 255);
11 text-transform: none !important;
12 line-height: 21px;
13 text-align: center;
14 background-color: rgb(35, 38, 51);
15 height: 38px;
16 margin-top: 20px;
17 width: 300px;
18 font-style: italic;
19 border-radius: 4px;
20 }
21
22 .terms_btn:hover{
23 color: rgb(255, 255, 255);
24 }
25 .bottom_ctas {
26 position: absolute;
27 left: 50%;
28 transform: translateX(-50%);
29 bottom: 200px;
30 }
31
32 body{
33 background-image: url("${BackgroundImageDesktop.getData()}");
34 background-repeat: no-repeat;
35 background-position: center 0px;
36 background-size: cover;
37 background-color: #000210;
38 }
39
40
41 .full_screen_container{
42 top: 5vh;
43 position: relative;
44 display: flex;
45 flex-direction: row;
46 flex-wrap: wrap;
47 align-items: center;
48 justify-content: space-around;
49 min-height: 860px;
50 margin-bottom: 50px !important;
51 }
52
53 .promo_container{
54 float: right;
55 padding: 30px 0;
56 background-image: linear-gradient(to bottom, rgba(0,2,16,0.8), rgba(0,2,16,0.4));
57 border-radius: 100px;
58 border-right: 2px solid;
59 border-left: 2px solid;
60 border-left-color: red;
61 border-right-color: red;
62 height: 174px;
63 margin-top: -600px;
64 }
65
66 .container_bottom{
67 position: relative;
68 bottom: 10px;
69 }
70
71 .promo_text p{
72 font-size: 26px !important;
73 font-family: "OpapMediumItalic";
74 color: rgb(255, 255, 255);
75 text-transform: none !important;
76 line-height: 34px;
77 text-align: center;
78 margin: 0 auto 5px auto;
79 width: 85%;
80 max-height: 235px;
81 font-weight: 800;
82 overflow: hidden;
83 -webkit-line-clamp: 8;
84 display: -webkit-box;
85 line-clamp: 8;
86 -webkit-box-orient: vertical;
87 white-space: break-spaces;
88 }
89
90 .terms_link{
91 display: flex;
92 justify-content: center;
93 }
94 #footer{
95 display: none;
96 }
97
98
99
100 .green_container{
101 border-radius: 3px;
102 background-color: rgb(27, 152, 0);
103 margin: auto;
104 text-align: center;
105 width: 300px;
106 height: 60px;
107 }
108
109 .green_container .btn{
110 font-size: 18px !important;
111 font-family: "OpapMediumItalic";
112 color: rgb(255, 255, 255);
113 font-weight: 800;
114 text-transform: uppercase;
115 line-height: 45px;
116 text-align: center;
117 font-style: italic;
118 }
119
120 .img_container{
121
122 }
123
124 .promo_img{
125 margin: auto;
126 max-width: 100%;
127 }
128
129
130
131 .new_footer{
132 width: 100vw;
133 position: fixed;
134 bottom: -1px;
135 left: 0;
136 background-color: black;
137 height: 38px;
138 align-items: center;
139 justify-content: center;
140 opacity: 0;
141 display: none;
142 }
143
144 .opac{
145 opacity: 1;
146 display:flex;
147 }
148
149 .footer_text {
150 font-family: "OPAPExt";
151 color: rgb(255, 255, 255);
152 text-transform: uppercase;
153 text-align: center;
154 font-size: 14px;
155 }
156
157
158 .footer_text .thumb_up_by_alex{
159 margin-left: 15px;
160 }
161
162 .collapsedlogin{
163 display: none !important;
164 }
165
166
167 .order1{
168 padding: 0;
169 order: 1;
170 display: flex;
171 align-items: center;
172 justify-content: center;
173 padding: 0;
174 margin: -500px 0 0 0;
175
176 }
177 .order2{
178 padding: 0;
179 order: 2;
180 display: flex;
181 align-items: center;
182 justify-content: center;
183 padding: 0;
184
185 }
186
187 .order3 {
188 padding: 0;
189 order: 3;
190 display: flex;
191 flex-direction: column;
192 align-items: center;
193 justify-content: center;
194 padding: 0;
195 }
196
197
198 @media screen and (max-width: 1280px){
199 .promo_text p{
200 line-height: 30px;
201 }
202 }
203
204
205
206 @media screen and (max-width: 1024px){
207 body{
208 background-position: center right;
209 }
210 }
211
212 @media screen and (max-width: 1016px){
213 .promo_container{
214 padding: 15px 0;
215 }
216
217 }
218
219
220 @media screen and (max-width: 992px){
221 .promo_container{
222 padding: 30px 0;
223 }
224
225 .full_screen_container{
226 justify-content: center;
227 margin-bottom: 75px !important;
228 }
229
230 .promo_img{
231 max-width: 100% !important;
232 width: 100%;
233 }
234
235
236 .img_container{
237 display: flex;
238 }
239
240 .marketing_title{
241 font-size: 36px;
242 font-weight: 500;
243 margin-bottom: 10px;
244 line-height: 38px;
245 }
246
247 .marketing_sub{
248 font-size: 20px;
249 line-height: 22px;
250 }
251
252 .thumb_up_by_alex{
253 margin: 10px 0;
254 }
255
256 .promo_container{
257 height: 200px;
258 }
259 }
260
261
262 @media screen and (max-width: 767px){
263
264
265 body{
266 background-position: center right;
267 }
268
269 .new_footer {
270 height: 80px;
271 background-color: rgb(0, 2, 16);
272 }
273
274 .footer_text {
275 padding: 0 20px;
276 }
277
278
279 .bottom_ctas {
280 bottom: 200px;
281 }
282 }
283
284 @media screen and (max-width: 560px){
285
286
287 }
288
289
290 @media screen and (max-width: 411px){
291 .new_footer {
292 height: 100px;
293 }
294 }
295 @media screen and (max-width: 500px){
296
297 body{
298 background-image: url("${BackgroundImageMobile.getData()}");
299 background-position: center -30px;
300 }
301
302
303 .promo_text p{
304 margin: 10px auto 5px auto;
305 -webkit-line-clamp: 9;
306 line-clamp: 9;
307 width: 82%;
308 font-weight: 700;
309 line-height: 25px;
310
311 }
312
313
314 .cta_container {
315 width: 100%;
316 }
317
318 .green_container{
319 width: 95%;
320 }
321
322 .bottom_ctas{
323 bottom: 165px;
324 }
325 .promo_container {
326 margin-top: -600px;
327 border-radius: 87px;
328 padding: 30px 0;
329 height: 277px;
330 background-image: linear-gradient(to bottom, rgba(0,2,16,0.8), rgba(0,2,16,0));
331
332
333 }
334 .terms_link{
335 padding: 0;
336 width: 95%;
337 }
338
339 .terms_link a{
340 width: 100%;
341 }
342
343 .terms_btn{
344 width: 100%;
345 }
346
347 .order1{
348 margin: -590px 0 0 0;
349 }
350 }
351
352
353
354
355
356</style>
357<#assign curLangId = themeDisplay.getLanguageId()>
358<#assign twoLettersLang = curLangId?split("_")[0]>
359<#assign
360 termsTitle = "Terms & Conditions"
361 regulate = "21+ | REGULATED BY: HELLENIC GAMING COMMISSION (HGC) | ADDICTION RISKS AND ASSET LOSS HELP LINE: 1114"
362 image ="/documents/159260/0/rg-badge-footer-en.png"
363/>
364<#if twoLettersLang = "el">
365 <#assign
366 termsTitle = "Όροι και Προϋποθέσεις"
367 regulate = "ΑΡΜΟΔΙΟΣ ΡΥΘΜΙΣΤΗΣ ΕΕΕΠ | Η ΣΥΜΜΕΤΟΧΗ ΣΕ ΤΥΧΕΡΑ ΠΑΙΓΝΙΑ ΕΠΙΤΡΕΠΕΤΑΙ ΜΟΝΟ ΣΕ ΑΤΟΜΑ ΑΝΩ ΤΩΝ 21 ΕΤΩΝ Η ΣΥΧΝΗ ΣΥΜΜΕΤΟΧΗ ΕΝΕΧΕΙ ΚΙΝΔΥΝΟ ΕΘΙΣΜΟΥ ΚΑΙ ΑΠΩΛΕΙΑΣ ΠΕΡΙΟΥΣΙΑΣ | ΓΡΑΜΜΗ ΣΤΗΡΙΞΗΣ: 1114"
368 image="/documents/159260/0/rg-badge-footer-gr.png"
369 />
370</#if>
371
372<div class="row full_screen_container">
373 <div class="col-xs-12 col-sm-8 promo_container order2">
374 <div class="promo_text">
375 <div class="loggedOUT">
376 <#if TermsHref.TermsGuestText.getSiblings()?has_content>
377 <#list TermsHref.TermsGuestText.getSiblings() as cur_TermsHref>
378 <p>
379 ${cur_TermsHref.getData()}
380 </p>
381 </#list>
382 </#if>
383 </div>
384 <div class="loggedIN collapsedlogin">
385 <#if TermsHref.TermsLoggedInText.getSiblings()?has_content>
386 <#list TermsHref.TermsLoggedInText.getSiblings() as cur_TermsHref2>
387 <p>
388 ${cur_TermsHref2.getData()}
389 </p>
390 </#list>
391 </#if>
392 </div>
393 </div>
394 </div>
395 <div class="col-xs-12 order1">
396 <div class="img_container">
397 <#if getterUtil.getBoolean(HidePromoImageForGuest.getData())>
398 <#if HidePromoImageForGuest.PromoImage.getData()?? && HidePromoImageForGuest.PromoImage.getData() != "">
399 <img class="promo_img"
400 data-fileentryid="${HidePromoImageForGuest.PromoImage.getAttribute("fileEntryId")}"
401 alt="${HidePromoImageForGuest.PromoImage.getAttribute("alt")}"
402 src="${HidePromoImageForGuest.PromoImage.getData()}"
403 />
404 </#if>
405 </#if>
406 </div>
407 </div>
408 <div class="col-xs-1 order4">
409 </div>
410 <div class="col-xs-12 bottom_ctas order3">
411 <div class="cta_container">
412 <a class="loggedOUT" href="${GreenCtAGuestHref.getData()}">
413 <div class="green_container">
414 <div class="btn">
415 ${GreenCtAGuestHref.GreenCtAGuestText.getData()}
416 </div>
417 </div>
418 </a>
419 <a class="loggedIN collapsedlogin" href="${GreenCtALoggedInHref.getData()}">
420 <div class="green_container">
421 <div class="btn">
422 ${GreenCtALoggedInHref.GreenCtALoggedInText.getData()}
423 </div>
424 </div>
425 </a>
426
427 </div>
428 <div class="col-xs-12 terms_link">
429 <a href="${TermsHref.getData()}">
430 <div class="btn terms_btn">
431 ${termsTitle}
432 </div>
433 </a>
434 </div>
435 </div>
436 </div>
437<div class="new_footer">
438 <div class="footer_text">
439 ${regulate} <img class="thumb_up_by_alex" src=${image} alt=""/>
440 </div>
441<div>
442 <script>
443 var valid_session = "VALID_USER_SESSION";
444 var no_user = "NO_USER_SESSION";
445
446 PubSub.subscribe(valid_session, function (msg, data) {
447 if(msg === valid_session) {
448 $(".loggedIN").each(function(){
449 $(this).removeClass("collapsedlogin")
450 })
451 $(".loggedOUT").each(function(){
452 $(this).addClass("collapsedlogin")
453 })
454 }
455 });
456
457 PubSub.subscribe(no_user, function (msg, data) {
458 if(msg === no_user) {
459 $(".loggedIN").each(function(){
460 $(this).addClass("collapsedlogin")
461 })
462 $(".loggedOUT").each(function(){
463 $(this).removeClass("collapsedlogin")
464 })
465 }
466 });
467$(document.body).on('touchmove', onScroll); // for mobile
468$(window).on('scroll', onScroll);
469
470// callback
471function onScroll(){
472 if( $(window).scrollTop() + window.innerHeight >= document.body.scrollHeight - 20 ) {
473 $(".new_footer").addClass("opac")
474 }else{
475 $(".new_footer").removeClass("opac")
476 }
477}
478
479
480
481//js to change only "pamestoixima.gr color to red adding a span class
482//first step: get parent element for logout
483var promo_logoutElement = document.getElementsByClassName("loggedOUT")[0];
484//second step: get paragraph of the parent element text
485var text = promo_logoutElement.getElementsByTagName("p")[0].innerHTML;
486
487//set object to be replaced 'string'
488var myObject = {
489 name: 'Pamestoixima.gr'
490}
491
492// maping the paragraph text with the string
493var result = text.split(' ').map(function(word) {
494 if (Object.values(myObject).includes(word)) {
495 return '<span class="red">' + word + '</span>'
496 } else {
497 return word
498 }
499})
500// final step: replace innerHTML of paragraph with the result of the map
501promo_logoutElement.getElementsByTagName("p")[0].innerHTML = result.join(' ');
502
503//same for the loggedIN
504var promo_loginElement = document.getElementsByClassName("loggedIN")[0];
505//second step: get paragraph of the parent element text
506var text = promo_loginElement.getElementsByTagName("p")[0].innerHTML;
507
508//set object to be replaced 'string'
509var myObject = {
510 name: 'Pamestoixima.gr'
511}
512
513// maping the paragraph text with the string
514var result = text.split(' ').map(function(word) {
515 if (Object.values(myObject).includes(word)) {
516 return '<span class="red">' + word + '</span>'
517 } else {
518 return word
519 }
520})
521// final step: replace innerHTML of paragraph with the result of the map
522promo_loginElement.getElementsByTagName("p")[0].innerHTML = result.join(' ');
523
524
525</script>