{"id":7,"date":"2026-10-16T13:04:46","date_gmt":"2026-10-16T13:04:46","guid":{"rendered":"https:\/\/touch.magicweb.gr\/?page_id=7"},"modified":"2026-10-16T14:24:14","modified_gmt":"2026-10-16T14:24:14","slug":"elementor-7","status":"publish","type":"page","link":"https:\/\/touch.magicweb.gr\/","title":{"rendered":"Elementor #7"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"7\" class=\"elementor elementor-7\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ef5d859 e-con e-atomic-element e-flexbox-base e-default-div e-f74bb73 \" data-id=\"ef5d859\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"ef5d859\">\n    \t\t<div class=\"elementor-element elementor-element-e097557 elementor-widget elementor-widget-html\" data-id=\"e097557\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n  KIOSK HOME \u2013 Example Hotel\r\n  \u0392\u03ac\u03bb' \u03c4\u03bf \u03c3\u03b5 Elementor > HTML widget (\u03c3\u03b5 \u03c3\u03b5\u03bb\u03af\u03b4\u03b1 \u03bc\u03b5 Canvas template)\r\n  \u0391\u03bb\u03bb\u03ac\u03b6\u03b5\u03b9\u03c2 \u03bc\u03cc\u03bd\u03bf \u03c4\u03b1 5 \u03c3\u03b7\u03bc\u03b5\u03af\u03b1 \u03c0\u03bf\u03c5 \u03b3\u03c1\u03ac\u03c6\u03bf\u03c5\u03bd \"\u0391\u039b\u039b\u0391\u039e\u0395 \u0395\u0394\u03a9\"\r\n============================================================ -->\r\n\r\n<style>\r\n  \/* \u039a\u03c1\u03cd\u03b2\u03b5\u03b9 header\/footer \u03c4\u03bf\u03c5 \u03b8\u03ad\u03bc\u03b1\u03c4\u03bf\u03c2 & scroll *\/\r\n  html, body { margin:0 !important; padding:0 !important; overflow:hidden !important; height:100%; }\r\n  header, footer, #wpadminbar, .site-header, .site-footer { display:none !important; }\r\n\r\n  .kiosk {\r\n    \/* \u0391\u039b\u039b\u0391\u039e\u0395 \u0395\u0394\u03a9 (1): \u03a0\u03a1\u039f\u0391\u0399\u03a1\u0395\u03a4\u0399\u039a\u0391 \u03b2\u03ac\u03bb\u03b5 \u03b4\u03b9\u03ba\u03ae \u03c3\u03bf\u03c5 \u03c6\u03c9\u03c4\u03bf\u03b3\u03c1\u03b1\u03c6\u03af\u03b1, \u03c0.\u03c7.\r\n       --bg-image: url(\"https:\/\/touch.magicweb.gr\/wp-content\/uploads\/2026\/10\/demobg-scaled.webp\");\r\n       \u0391\u03bd \u03bc\u03b5\u03af\u03bd\u03b5\u03b9 \"none\", \u03c6\u03b1\u03af\u03bd\u03b5\u03c4\u03b1\u03b9 \u03b7 \u03b5\u03bd\u03c3\u03c9\u03bc\u03b1\u03c4\u03c9\u03bc\u03ad\u03bd\u03b7 \u03b5\u03b9\u03ba\u03cc\u03bd\u03b1 (\u03b7\u03bb\u03b9\u03bf\u03b2\u03b1\u03c3\u03af\u03bb\u03b5\u03bc\u03b1 \u03c3\u03c4\u03b7\u03bd \u03c0\u03b9\u03c3\u03af\u03bd\u03b1) *\/\r\n    --bg-image: url(\"https:\/\/touch.magicweb.gr\/wp-content\/uploads\/2026\/10\/demobg-scaled.webp\");\r\n    --teal: #1f6b78;\r\n    --teal-deep: #17525d;\r\n    --gold: #e8b45a;\r\n    --cream: #f4efe6;\r\n\r\n    position: fixed; inset: 0; z-index: 99999;\r\n    display: flex; align-items: center; justify-content: center;\r\n    padding: 4vmin; box-sizing: border-box;\r\n    background: #17525d;\r\n    overflow: hidden;\r\n    font-family: \"Poppins\", \"Segoe UI\", Roboto, Arial, sans-serif;\r\n    -webkit-user-select: none; user-select: none;\r\n    -webkit-touch-callout: none; touch-action: manipulation;\r\n    -webkit-tap-highlight-color: transparent;\r\n  }\r\n  .kiosk *, .kiosk *::before, .kiosk *::after { box-sizing: border-box; }\r\n\r\n  .kiosk__bg, .kiosk__photo { position:absolute; inset:0; width:100%; height:100%; }\r\n  .kiosk__photo { background: var(--bg-image) center \/ cover no-repeat; }\r\n\r\n  .kiosk__card {\r\n    position: relative; z-index: 2;\r\n    width: min(86vw, 900px);\r\n    padding: clamp(28px, 6vmin, 72px) clamp(24px, 5vmin, 64px);\r\n    background: var(--teal);\r\n    background: color-mix(in srgb, var(--teal) 96%, transparent);\r\n    color: #fff; text-align: center;\r\n    border-radius: 6px;\r\n    box-shadow: 0 30px 80px rgba(0,0,0,.35);\r\n    animation: kioskIn .9s ease both;\r\n  }\r\n  @keyframes kioskIn { from { opacity:0; transform: translateY(16px);} to { opacity:1; transform:none; } }\r\n\r\n  .kiosk__logo { display:block; margin: 0 auto clamp(16px, 3vmin, 32px); width: clamp(180px, 34vmin, 380px); height: auto; }\r\n  .kiosk__logo-img { display:block; margin: 0 auto clamp(16px, 3vmin, 32px); width: clamp(180px, 34vmin, 380px); height:auto; }\r\n\r\n  .kiosk__text {\r\n    margin: 0 auto clamp(24px, 5vmin, 56px);\r\n    max-width: 34em;\r\n    font-size: clamp(16px, 2.6vmin, 28px);\r\n    line-height: 1.5; font-weight: 400;\r\n  }\r\n  .kiosk__text strong { display:block; font-weight:600; margin-bottom:.4em; }\r\n\r\n  .kiosk__buttons { display:flex; flex-wrap:wrap; gap: clamp(12px, 2.4vmin, 28px); justify-content:center; }\r\n\r\n  .kiosk__btn {\r\n    flex: 1 1 0; min-width: 160px; max-width: 260px;\r\n    min-height: clamp(64px, 10vmin, 110px);   \/* \u03bc\u03b5\u03b3\u03ac\u03bb\u03bf touch target *\/\r\n    display:flex; align-items:center; justify-content:center;\r\n    padding: 0 28px;\r\n    background: var(--cream); color: #3d4a4d;\r\n    border-radius: 999px;\r\n    font-size: clamp(18px, 3vmin, 32px); font-weight: 500;\r\n    text-decoration: none;\r\n    box-shadow: 0 6px 18px rgba(0,0,0,.22);\r\n    transition: transform .12s ease, background .12s ease, box-shadow .12s ease;\r\n  }\r\n  .kiosk__btn:active { transform: scale(.95); background: var(--gold); box-shadow: 0 2px 8px rgba(0,0,0,.25); }\r\n  .kiosk__btn:focus-visible { outline: 4px solid var(--gold); outline-offset: 3px; }\r\n\r\n  @media (max-width: 700px) { .kiosk__btn { max-width:none; flex-basis:100%; } }\r\n  @media (prefers-reduced-motion: reduce) { .kiosk__card { animation:none; } }\r\n<\/style>\r\n\r\n<div class=\"kiosk\" role=\"main\">\r\n\r\n  <!-- \u0395\u03bd\u03c3\u03c9\u03bc\u03b1\u03c4\u03c9\u03bc\u03ad\u03bd\u03bf \u03c6\u03cc\u03bd\u03c4\u03bf: \u03b7\u03bb\u03b9\u03bf\u03b2\u03b1\u03c3\u03af\u03bb\u03b5\u03bc\u03b1 \u03c0\u03ac\u03bd\u03c9 \u03b1\u03c0\u03cc \u03c0\u03b9\u03c3\u03af\u03bd\u03b1 \u03be\u03b5\u03bd\u03bf\u03b4\u03bf\u03c7\u03b5\u03af\u03bf\u03c5 -->\r\n  <svg class=\"kiosk__bg\" viewBox=\"0 0 1600 900\" preserveAspectRatio=\"xMidYMid slice\" aria-hidden=\"true\">\r\n    <defs>\r\n      <linearGradient id=\"kSky\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\r\n        <stop offset=\"0\" stop-color=\"#86b4c6\"\/><stop offset=\".55\" stop-color=\"#f1d8a6\"\/><stop offset=\"1\" stop-color=\"#f6c488\"\/>\r\n      <\/linearGradient>\r\n      <radialGradient id=\"kSun\"><stop offset=\"0\" stop-color=\"#fff6d8\"\/><stop offset=\".35\" stop-color=\"#fff0c0\" stop-opacity=\".7\"\/><stop offset=\"1\" stop-color=\"#fff0c0\" stop-opacity=\"0\"\/><\/radialGradient>\r\n      <linearGradient id=\"kSea\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\"><stop offset=\"0\" stop-color=\"#e7c995\"\/><stop offset=\"1\" stop-color=\"#8fbcc4\"\/><\/linearGradient>\r\n      <linearGradient id=\"kPool\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\r\n        <stop offset=\"0\" stop-color=\"#f0d4a0\"\/><stop offset=\".25\" stop-color=\"#8fc4c6\"\/><stop offset=\"1\" stop-color=\"#2b7f8e\"\/>\r\n      <\/linearGradient>\r\n      <linearGradient id=\"kDeck\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\"><stop offset=\"0\" stop-color=\"#e8dcc4\"\/><stop offset=\"1\" stop-color=\"#cdbf9f\"\/><\/linearGradient>\r\n    <\/defs>\r\n\r\n    <rect width=\"1600\" height=\"900\" fill=\"url(#kSky)\"\/>\r\n    <circle cx=\"1130\" cy=\"420\" r=\"230\" fill=\"url(#kSun)\"\/>\r\n    <circle cx=\"1130\" cy=\"425\" r=\"48\" fill=\"#fff6dc\"\/>\r\n\r\n    <!-- \u03bb\u03cc\u03c6\u03bf\u03b9 & \u03b8\u03ac\u03bb\u03b1\u03c3\u03c3\u03b1 -->\r\n    <path d=\"M0 440 L180 395 L360 430 L560 380 L760 440 L760 480 L0 480Z\" fill=\"#8aa6aa\" opacity=\".75\"\/>\r\n    <path d=\"M700 450 L930 410 L1150 445 L1400 400 L1600 430 L1600 480 L700 480Z\" fill=\"#7c9a9d\" opacity=\".8\"\/>\r\n    <rect y=\"470\" width=\"1600\" height=\"110\" fill=\"url(#kSea)\"\/>\r\n    <path d=\"M900 480h420M960 500h300M1010 520h200\" stroke=\"#fff3d0\" stroke-width=\"3\" stroke-linecap=\"round\" opacity=\".55\"\/>\r\n\r\n    <!-- \u03c0\u03c1\u03ac\u03c3\u03b9\u03bd\u03bf & \u03ba\u03c5\u03c0\u03b1\u03c1\u03af\u03c3\u03c3\u03b9\u03b1 -->\r\n    <path d=\"M0 520 C150 490 300 520 460 535 L520 590 L0 600Z\" fill=\"#4d6f52\"\/>\r\n    <path d=\"M0 540 C120 520 260 545 380 560 L400 600 L0 610Z\" fill=\"#3b5c44\"\/>\r\n    <g fill=\"#2f4d3a\">\r\n      <ellipse cx=\"140\" cy=\"470\" rx=\"16\" ry=\"62\"\/><ellipse cx=\"205\" cy=\"485\" rx=\"13\" ry=\"48\"\/>\r\n      <ellipse cx=\"1450\" cy=\"465\" rx=\"17\" ry=\"66\"\/><ellipse cx=\"1515\" cy=\"480\" rx=\"13\" ry=\"50\"\/>\r\n    <\/g>\r\n    <g fill=\"#e9a8b8\" opacity=\".9\"><circle cx=\"60\" cy=\"560\" r=\"7\"\/><circle cx=\"95\" cy=\"572\" r=\"6\"\/><circle cx=\"250\" cy=\"566\" r=\"6\"\/><circle cx=\"300\" cy=\"575\" r=\"7\"\/><\/g>\r\n\r\n    <!-- \u03c0\u03ad\u03c4\u03c1\u03b9\u03bd\u03b7 \u03b1\u03c8\u03af\u03b4\u03b1 \u03b4\u03b5\u03be\u03b9\u03ac -->\r\n    <path d=\"M1380 590 V420 q110 -90 220 0 V590Z\" fill=\"#d9cdb4\"\/>\r\n    <path d=\"M1420 590 V440 q70 -55 140 0 V590Z\" fill=\"#8b7a5e\" opacity=\".55\"\/>\r\n\r\n    <!-- deck & \u03c0\u03b9\u03c3\u03af\u03bd\u03b1 -->\r\n    <path d=\"M0 585 H1600 V900 H0Z\" fill=\"url(#kDeck)\"\/>\r\n    <path d=\"M-20 640 H1620 V900 H-20Z\" fill=\"#f6efe0\"\/>\r\n    <path d=\"M0 660 H1600 V900 H0Z\" fill=\"url(#kPool)\"\/>\r\n    <g opacity=\".5\" stroke-linecap=\"round\">\r\n      <path d=\"M1000 690h300M1060 720h220M900 760h420\" stroke=\"#fff3d0\" stroke-width=\"5\"\/>\r\n      <path d=\"M120 700h260M200 740h180\" stroke=\"#2f5d49\" stroke-width=\"6\"\/>\r\n      <path d=\"M300 800h380M700 840h300\" stroke=\"#ffffff\" stroke-width=\"3\"\/>\r\n    <\/g>\r\n\r\n    <!-- \u03be\u03b1\u03c0\u03bb\u03ce\u03c3\u03c4\u03c1\u03b5\u03c2 -->\r\n    <g fill=\"#f3eee2\"><rect x=\"1190\" y=\"602\" width=\"170\" height=\"26\" rx=\"8\"\/><rect x=\"1400\" y=\"608\" width=\"170\" height=\"26\" rx=\"8\"\/><\/g>\r\n    <g fill=\"#c9bda3\"><rect x=\"1190\" y=\"624\" width=\"170\" height=\"8\" rx=\"4\"\/><rect x=\"1400\" y=\"630\" width=\"170\" height=\"8\" rx=\"4\"\/><\/g>\r\n  <\/svg>\r\n  <div class=\"kiosk__photo\"><\/div>\r\n\r\n  <div class=\"kiosk__card\">\r\n\r\n    <!-- \u0391\u039b\u039b\u0391\u039e\u0395 \u0395\u0394\u03a9 (2): \u039b\u039f\u0393\u039f\u03a4\u03a5\u03a0\u039f\r\n         \u0391) \u0391\u03bd \u03ad\u03c7\u03b5\u03b9\u03c2 \u03b5\u03b9\u03ba\u03cc\u03bd\u03b1 \u03bb\u03bf\u03b3\u03bf\u03c4\u03cd\u03c0\u03bf\u03c5, \u03c3\u03b2\u03ae\u03c3\u03b5 \u03c4\u03bf <svg> \u03c0\u03b1\u03c1\u03b1\u03ba\u03ac\u03c4\u03c9 \u03ba\u03b1\u03b9 \u03b2\u03ac\u03bb\u03b5:\r\n            <img decoding=\"async\" class=\"kiosk__logo-img\" src=\"https:\/\/YOUR-SITE.gr\/wp-content\/uploads\/logo.png\" alt=\"Example Hotel\">\r\n         \u0392) \u0391\u03bb\u03bb\u03b9\u03ce\u03c2 \u03bc\u03ad\u03bd\u03b5\u03b9 \u03b1\u03c5\u03c4\u03cc \u03c4\u03bf \u03c0\u03c1\u03bf\u03c3\u03c9\u03c1\u03b9\u03bd\u03cc SVG -->\r\n    <svg class=\"kiosk__logo\" viewBox=\"0 0 300 260\" role=\"img\" aria-label=\"Example Hotel\">\r\n      <g fill=\"none\" stroke=\"#e8b45a\" stroke-width=\"5\" stroke-linecap=\"round\">\r\n        <path d=\"M105 120 V70 a45 45 0 0 1 90 0 V120 Z\"\/>\r\n        <path d=\"M117 120 V72 a33 33 0 0 1 66 0 V120\"\/>\r\n        <circle cx=\"150\" cy=\"78\" r=\"13\" fill=\"#e8b45a\" stroke=\"none\"\/>\r\n        <path d=\"M150 52v-8M150 112v-8M124 78h-8M184 78h-8M132 60l-6-6M174 60l6-6M132 96l-6 6M174 96l6 6\" stroke-width=\"4\"\/>\r\n        <path d=\"M117 100c11-7 22 7 33 0s22 7 33 0\"\/>\r\n        <path d=\"M117 111c11-7 22 7 33 0s22 7 33 0\"\/>\r\n      <\/g>\r\n      <text x=\"150\" y=\"190\" text-anchor=\"middle\" font-family=\"Georgia, 'Times New Roman', serif\"\r\n            font-size=\"64\" font-weight=\"700\" fill=\"#ffffff\">Example<\/text>\r\n      <text x=\"150\" y=\"228\" text-anchor=\"middle\" font-family=\"Georgia, serif\"\r\n            font-size=\"22\" letter-spacing=\"9\" fill=\"#e8b45a\">HOTEL<\/text>\r\n    <\/svg>\r\n\r\n    <!-- \u0391\u039b\u039b\u0391\u039e\u0395 \u0395\u0394\u03a9 (3): \u03ba\u03b5\u03af\u03bc\u03b5\u03bd\u03bf \u03ba\u03b1\u03bb\u03c9\u03c3\u03bf\u03c1\u03af\u03c3\u03bc\u03b1\u03c4\u03bf\u03c2 -->\r\n    <p class=\"kiosk__text\">\r\n      <strong>Welcome to your home away from home.<\/strong>\r\n      Explore our menus, discover activities for little guests, and find useful information for your stay.\r\n    <\/p>\r\n\r\n    <!-- \u0391\u039b\u039b\u0391\u039e\u0395 \u0395\u0394\u03a9 (4): \u03c4\u03b1 links \u03c4\u03c9\u03bd 3 \u03ba\u03bf\u03c5\u03bc\u03c0\u03b9\u03ce\u03bd -->\r\n    <nav class=\"kiosk__buttons\">\r\n      <a class=\"kiosk__btn\" href=https:\/\/touch.magicweb.gr\/?page_id=17\">Menus<\/a>\r\n      <a class=\"kiosk__btn\" href=\"https:\/\/touch.magicweb.gr\/?page_id=35\">Kids Activities<\/a>\r\n      <a class=\"kiosk__btn\" href=\"#\">FAQ<\/a>\r\n    <\/nav>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n  \/\/ Kiosk: \u03bc\u03c0\u03bb\u03bf\u03ba\u03ac\u03c1\u03b5\u03b9 \u03b4\u03b5\u03be\u03af \u03ba\u03bb\u03b9\u03ba \/ long-press \u03bc\u03b5\u03bd\u03bf\u03cd \u03ba\u03b1\u03b9 pinch-zoom\r\n  document.addEventListener('contextmenu', e => e.preventDefault());\r\n  document.addEventListener('gesturestart', e => e.preventDefault());\r\n  \/\/ \u0391\u039b\u039b\u0391\u039e\u0395 \u0395\u0394\u03a9 (5) (\u03c0\u03c1\u03bf\u03b1\u03b9\u03c1\u03b5\u03c4\u03b9\u03ba\u03cc): \u03b5\u03c0\u03b9\u03c3\u03c4\u03c1\u03bf\u03c6\u03ae \u03c3\u03c4\u03b7\u03bd \u03b1\u03c1\u03c7\u03b9\u03ba\u03ae \u03bc\u03b5\u03c4\u03ac \u03b1\u03c0\u03cc \u03b1\u03b4\u03c1\u03ac\u03bd\u03b5\u03b9\u03b1 (\u03ce\u03c1\u03b1 \u03c3\u03b5 \u03b4\u03b5\u03c5\u03c4\u03b5\u03c1\u03cc\u03bb\u03b5\u03c0\u03c4\u03b1)\r\n  \/\/ \u0392\u03ac\u03bb\u03b5 \u03c4\u03bf \u03af\u03b4\u03b9\u03bf script \u03c3\u03c4\u03b9\u03c2 \u03c5\u03c0\u03cc\u03bb\u03bf\u03b9\u03c0\u03b5\u03c2 \u03c3\u03b5\u03bb\u03af\u03b4\u03b5\u03c2 \u03bc\u03b5 HOME_URL = \"\/\" \u03ba\u03b1\u03b9 IDLE = 60\r\n  \/\/ (\u03c3\u03c4\u03b7\u03bd \u03b1\u03c1\u03c7\u03b9\u03ba\u03ae \u03b4\u03b5\u03bd \u03c7\u03c1\u03b5\u03b9\u03ac\u03b6\u03b5\u03c4\u03b1\u03b9)\r\n<\/script>\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Example HOTEL Welcome to your home away from home. Explore our menus, discover activities for little guests, and find useful information for your stay.<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-7","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/touch.magicweb.gr\/index.php?rest_route=\/wp\/v2\/pages\/7","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/touch.magicweb.gr\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/touch.magicweb.gr\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/touch.magicweb.gr\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/touch.magicweb.gr\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=7"}],"version-history":[{"count":22,"href":"https:\/\/touch.magicweb.gr\/index.php?rest_route=\/wp\/v2\/pages\/7\/revisions"}],"predecessor-version":[{"id":48,"href":"https:\/\/touch.magicweb.gr\/index.php?rest_route=\/wp\/v2\/pages\/7\/revisions\/48"}],"wp:attachment":[{"href":"https:\/\/touch.magicweb.gr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=7"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}