html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; }

html { line-height: 1; }

ol, ul { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; }

q, blockquote { quotes: none; }
q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; }

a img { border: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }

/*** COLORI ***/
/*** SPLASHPAGE ***/
/*** SALE ***/
/*** GIOCO ***/
/* CSS Document */
/* Lista delle famiglie di font, per ogni famiglia inserisco la variabile e la sua posizione */
@font-face { font-family: "ArialNova-Light"; src: url("../font/ArialNova-Light.eot"); src: url("../font/ArialNova-Light.ttf") format("truetype"), url("../font/ArialNova-Light.eot?#iefix") format("embedded-opentype"), url("../font/ArialNova-Light.otf"), url("../font/ArialNova-Light.svg#ArialNova-Light") format("svg"), url("../font/ArialNova-Light.woff") format("woff"); }
@font-face { font-family: "ArialNova"; src: url("../font/ArialNova.eot"); src: url("../font/ArialNova.ttf") format("truetype"), url("../font/ArialNova.eot?#iefix") format("embedded-opentype"), url("../font/ArialNova.otf"), url("../font/ArialNova.svg#ArialNova") format("svg"), url("../font/ArialNova.woff") format("woff"); }
@font-face { font-family: "ArialNova-Italic"; src: url("../font/ArialNova-Italic.eot"); src: url("../font/ArialNova-Italic.ttf") format("truetype"), url("../font/ArialNova-Italic.eot?#iefix") format("embedded-opentype"), url("../font/ArialNova-Italic.otf"), url("../font/ArialNova-Italic.svg#ArialNova-Italic") format("svg"), url("../font/ArialNova-Italic.woff") format("woff"); }
@font-face { font-family: "ArialNova-Bold"; src: url("../font/ArialNova-Bold.eot"); src: url("../font/ArialNova-Bold.ttf") format("truetype"), url("../font/ArialNova-Bold.eot?#iefix") format("embedded-opentype"), url("../font/ArialNova-Bold.otf"), url("../font/ArialNova-Bold.svg#ArialNova-Bold") format("svg"), url("../font/ArialNova-Bold.woff") format("woff"); }
@font-face { font-family: "ArialNova-BoldItalic"; src: url("../font/ArialNova-BoldItalic.eot"); src: url("../font/ArialNova-BoldItalic.ttf") format("truetype"), url("../font/ArialNova-BoldItalic.eot?#iefix") format("embedded-opentype"), url("../font/ArialNova-BoldItalic.otf"), url("../font/ArialNova-BoldItalic.svg#ArialNova-BoldItalic") format("svg"), url("../font/ArialNova-BoldItalic.woff") format("woff"); }
@font-face { font-family: "ArialNovaCond-Light"; src: url("../font/ArialNovaCond-Light.eot"); src: url("../font/ArialNovaCond-Light.ttf") format("truetype"), url("../font/ArialNovaCond-Light.eot?#iefix") format("embedded-opentype"), url("../font/ArialNovaCond-Light.otf"), url("../font/ArialNovaCond-Light.svg#ArialNovaCond-Light") format("svg"), url("../font/ArialNovaCond-Light.woff") format("woff"); }
@font-face { font-family: "ArialNovaCond"; src: url("../font/ArialNovaCond.eot"); src: url("../font/ArialNovaCond.ttf") format("truetype"), url("../font/ArialNovaCond.eot?#iefix") format("embedded-opentype"), url("../font/ArialNovaCond.otf"), url("../font/ArialNovaCond.svg#ArialNovaCond") format("svg"), url("../font/ArialNovaCond.woff") format("woff"); }
@font-face { font-family: "ArialNovaCond-Italic"; src: url("../font/ArialNovaCond-Italic.eot"); src: url("../font/ArialNovaCond-Italic.ttf") format("truetype"), url("../font/ArialNovaCond-Italic.eot?#iefix") format("embedded-opentype"), url("../font/ArialNovaCond-Italic.otf"), url("../font/ArialNovaCond-Italic.svg#ArialNovaCond-Italic") format("svg"), url("../font/ArialNovaCond-Italic.woff") format("woff"); }
@font-face { font-family: "ArialNovaCond-Bold"; src: url("../font/ArialNovaCond-Bold.eot"); src: url("../font/ArialNovaCond-Bold.ttf") format("truetype"), url("../font/ArialNovaCond-Bold.eot?#iefix") format("embedded-opentype"), url("../font/ArialNovaCond-Bold.otf"), url("../font/ArialNovaCond-Bold.svg#ArialNovaCond-Bold") format("svg"), url("../font/ArialNovaCond-Bold.woff") format("woff"); }
@font-face { font-family: "ArialNovaCond-BoldItalic"; src: url("../font/ArialNovaCond-BoldItalic.eot"); src: url("../font/ArialNovaCond-BoldItalic.ttf") format("truetype"), url("../font/ArialNovaCond-BoldItalic.eot?#iefix") format("embedded-opentype"), url("../font/ArialNovaCond-BoldItalic.otf"), url("../font/ArialNovaCond-BoldItalic.svg#ArialNovaCond-BoldItalic") format("svg"), url("../font/ArialNovaCond-BoldItalic.woff") format("woff"); }
@font-face { font-family: "Abril"; src: url("../font/Abril.eot"); src: url("../font/Abril.ttf") format("truetype"), url("../font/Abril.eot?#iefix") format("embedded-opentype"), url("../font/Abril.otf"), url("../font/Abril.svg#Abril") format("svg"), url("../font/Abril.woff") format("woff"); }
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-font-smoothing: antialiased; transition: opacity 0.5s; overscroll-behavior: none; }
*.disable { opacity: 0.2; pointer-events: none; }
*.hidden { display: none; }
* a:active { opacity: 0.5; }
*.centrato { padding-left: 30px; padding-right: 30px; }

::-webkit-scrollbar { width: 10px; width: 0; }

html, body { width: 100%; height: 100dvh; display: flex; flex-direction: column; background-color: #f8f8f8; /* PAGINE */ }
html.disabled #app-container footer, body.disabled #app-container footer { opacity: 0.5; }
html a.back-button, body a.back-button { content: ""; background-image: url("../layout/icon-btn_back.svg"); background-size: 20px; background-position: center; background-repeat: no-repeat; background-color: transparent; width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; cursor: pointer; margin-right: 10px; margin-top: 5px; border: none; }
html button.audio-button, body button.audio-button { content: ""; background-image: url("../layout/icon-audio.svg"); background-size: 25px; background-position: center; background-repeat: no-repeat; background-color: transparent; background-color: #005D75; border-radius: 50%; padding: 25px; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; cursor: pointer; border: none; box-shadow: 0px 5px 10px #00000029; z-index: 1; }
html button.audio-button.playing, body button.audio-button.playing { background-image: url("../layout/icon-pause.svg"); }
html button.lis-button, body button.lis-button { content: ""; background-image: url("../layout/icon-lis.svg"); background-size: 25px; background-position: center; background-repeat: no-repeat; background-color: transparent; background-color: #005D75; border-radius: 50%; padding: 25px; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; cursor: pointer; border: none; box-shadow: 0px 5px 10px #00000029; }
html button.close-lis-button, body button.close-lis-button { position: absolute; top: 20px; left: 20px; content: ""; background-image: url("../layout/icon-btn_back.svg"); background-size: 25px; background-position: center; background-repeat: no-repeat; background-color: #ffffff; border-radius: 50%; padding: 25px; width: 30px; height: 30px; cursor: pointer; border: none; box-shadow: 0px 5px 10px #00000029; z-index: 99; }
html button.qrcode-button, body button.qrcode-button { content: ""; background-image: url("../layout/icon-qrcode.svg"); background-size: 25px; background-position: center; background-repeat: no-repeat; background-color: transparent; background-color: #005D75; border-radius: 50%; padding: 25px; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; cursor: pointer; border: none; box-shadow: 0px 5px 10px #00000029; }
html button.arrow-left, body button.arrow-left { content: ""; background-image: url("../layout/icon-btn_back.svg"); background-size: 25px; background-position: center; background-repeat: no-repeat; background-color: transparent; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; cursor: pointer; border: none; }
html button.arrow-right, body button.arrow-right { content: ""; transform: rotate(180deg); background-image: url("../layout/icon-btn_back.svg"); background-size: 25px; background-position: center; background-repeat: no-repeat; background-color: transparent; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; cursor: pointer; border: none; }
html #loading-page, body #loading-page { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; background-color: #005D75; background-image: url("../layout/Screensaver.jpg"); background-position: center; background-repeat: no-repeat; background-size: cover; }
html #loading-page .logo, body #loading-page .logo { width: 300px; height: 300px; content: ""; background-image: url("../layout/Logo.svg"); background-position: center; background-repeat: no-repeat; background-size: contain; }
html #app-container, body #app-container { min-width: 360px; flex: 1; display: flex; flex-direction: column; color: #414141; }
html #app-container header, body #app-container header { height: 120px; display: flex; align-items: center; background-color: #f8f8f8; }
html #app-container header .title-page, body #app-container header .title-page { display: flex; align-items: center; padding-right: 80px; }
html #app-container header .title-page h1, body #app-container header .title-page h1 { text-transform: uppercase; color: #005D75; }
html #app-container main, body #app-container main { display: flex; flex-direction: column; flex: 1; padding-top: 15px; background-color: #f8f8f8; }
html #app-container main.home, body #app-container main.home { padding-top: 0px; margin-top: 100px; }
html #app-container main.home header .title-page, body #app-container main.home header .title-page { padding: 0; }
html #app-container main::-webkit-scrollbar, body #app-container main::-webkit-scrollbar { width: 0; height: 0; }
html #app-container main #color-bar, body #app-container main #color-bar { width: 100%; height: 15px; display: flex; position: fixed; top: 0; left: 0; right: 0; background-color: #f8f8f8; z-index: 2; }
html #app-container main #color-bar .color, body #app-container main #color-bar .color { width: 100%; height: 100%; background-color: #005D75; }
html #app-container main #home .major-section, body #app-container main #home .major-section { padding-bottom: 20px; }
html #app-container main #home .major-section ul, body #app-container main #home .major-section ul { display: flex; flex-direction: column; justify-content: center; gap: 40px; }
html #app-container main #home .major-section ul li a, body #app-container main #home .major-section ul li a { display: block; width: 100%; height: 100%; }
html #app-container main #home .major-section ul li a img, body #app-container main #home .major-section ul li a img { width: 100%; height: 110px; object-fit: cover; object-position: center center; box-shadow: 0px 3px 6px #00000029; margin-bottom: 10px; }
html #app-container main #home .major-section ul li a h2, body #app-container main #home .major-section ul li a h2 { margin-bottom: 5px; color: #005D75; }
html #app-container main #home .mid-section, body #app-container main #home .mid-section { padding-top: 20px; padding-bottom: 20px; }
html #app-container main #home .mid-section .mid-buttons, body #app-container main #home .mid-section .mid-buttons { display: flex; flex-wrap: wrap; }
html #app-container main #home .mid-section .mid-buttons li, body #app-container main #home .mid-section .mid-buttons li { width: calc((100% / 2) - 0px); margin-bottom: 30px; }
html #app-container main #home .mid-section .mid-buttons li a, body #app-container main #home .mid-section .mid-buttons li a { display: flex; flex-direction: column; align-items: center; gap: 5px; }
html #app-container main #home .mid-section .mid-buttons li a img, body #app-container main #home .mid-section .mid-buttons li a img { width: 110px; height: 110px; object-fit: cover; border: 6px solid #646464; border-radius: 50%; box-shadow: 0px 3px 15px #00000029; border: 6px solid #005D75; }
html #app-container main #home .mid-section .mid-buttons li a h2, body #app-container main #home .mid-section .mid-buttons li a h2 { width: 120px; text-align: center; color: #005D75; }
html #app-container main #home .mid-section .sale, body #app-container main #home .mid-section .sale { position: relative; display: block; width: 100%; background-color: #005D75; padding: 30px; }
html #app-container main #home .mid-section .sale img, body #app-container main #home .mid-section .sale img { width: 100%; height: 230px; object-fit: contain; object-position: center center; margin-bottom: -50px; z-index: 0; }
html #app-container main #home .mid-section .sale h2, body #app-container main #home .mid-section .sale h2 { color: #ffffff; margin-bottom: 5px; }
html #app-container main #home .mid-section .sale p, body #app-container main #home .mid-section .sale p { color: #ffffff; }
html #app-container main #home .minor-section, body #app-container main #home .minor-section { padding: 30px 0; }
html #app-container main #home .minor-section ul, body #app-container main #home .minor-section ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 30px; }
html #app-container main #home .minor-section ul li, body #app-container main #home .minor-section ul li { width: 130px; }
html #app-container main #home .minor-section ul li a, body #app-container main #home .minor-section ul li a { display: flex; flex-direction: column; align-items: center; justify-content: space-between; height: 100%; width: 100%; }
html #app-container main #home .minor-section ul li a h2, body #app-container main #home .minor-section ul li a h2 { width: 90px; line-height: 20px; text-align: center; }
html #app-container main #info-container, body #app-container main #info-container { display: flex; flex-direction: column; gap: 15px; }
html #app-container main #info-container p, body #app-container main #info-container p { line-height: 25px; }
html #app-container main #info-container p strong, body #app-container main #info-container p strong { margin-bottom: 5px; }
html #app-container main #scheda-container .scheda-content .media-component, body #app-container main #scheda-container .scheda-content .media-component { position: relative; }
html #app-container main #scheda-container .scheda-content .scheda-text-container, body #app-container main #scheda-container .scheda-content .scheda-text-container { margin: 30px 0; display: flex; flex-direction: column; gap: 15px; }
html #app-container main #scheda-container .scheda-content .scheda-text-container .text-highlighted p, body #app-container main #scheda-container .scheda-content .scheda-text-container .text-highlighted p { font-family: "ArialNovaCond-Bold"; font-size: 20px; }
html #app-container main #scheda-container .scheda-content .scheda-text-container .text-content, body #app-container main #scheda-container .scheda-content .scheda-text-container .text-content { display: flex; flex-direction: column; gap: 15px; }
html #app-container main #sale-container, body #app-container main #sale-container { display: flex; flex-direction: column; flex: 1; }
html #app-container main #sale-container .sale-content, body #app-container main #sale-container .sale-content { display: flex; flex-direction: column; flex: 1; }
html #app-container main #sale-container .sale-content .map-view, body #app-container main #sale-container .sale-content .map-view { flex: 1; display: flex; flex-direction: column; background: #f8f8f8; }
html #app-container main #sale-container .sale-content .map-view .top-bar, body #app-container main #sale-container .sale-content .map-view .top-bar { height: 80px; display: flex; align-items: center; gap: 15px; }
html #app-container main #sale-container .sale-content .map-view .top-bar select, body #app-container main #sale-container .sale-content .map-view .top-bar select { display: flex; align-items: center; justify-content: center; cursor: pointer; text-decoration: none; transition: color 0.3s; background-color: #005D75; color: #ffffff; padding: 15px 30px 15px 15px; border-radius: 25px; box-shadow: 0px 3px 15px #00000029; /* Arrow */ appearance: none; background-image: url("../layout/icon-btn_arrow_down_white.svg"); background-repeat: no-repeat; background-position: right 0.7rem top 50%; background-size: 15px auto; }
html #app-container main #sale-container .sale-content .canvas-container, body #app-container main #sale-container .sale-content .canvas-container { flex: 1; display: flex; flex-direction: column; height: calc(100% - 80px); overflow-x: auto; }
html #app-container main #sale-container .sale-content .canvas-container .canvas-content, body #app-container main #sale-container .sale-content .canvas-container .canvas-content { position: relative; height: 100%; width: 250%; }
html #app-container main #sale-container .sale-content .canvas-container .canvas-content .first-floor, html #app-container main #sale-container .sale-content .canvas-container .canvas-content .ground-floor, body #app-container main #sale-container .sale-content .canvas-container .canvas-content .first-floor, body #app-container main #sale-container .sale-content .canvas-container .canvas-content .ground-floor { position: relative; height: 100%; width: 100%; overflow: hidden; display: none; }
html #app-container main #sale-container .sale-content .canvas-container .canvas-content .first-floor.active, html #app-container main #sale-container .sale-content .canvas-container .canvas-content .ground-floor.active, body #app-container main #sale-container .sale-content .canvas-container .canvas-content .first-floor.active, body #app-container main #sale-container .sale-content .canvas-container .canvas-content .ground-floor.active { display: block; }
html #app-container main #sale-container .sale-content .canvas-container .canvas-content .first-floor img, html #app-container main #sale-container .sale-content .canvas-container .canvas-content .ground-floor img, body #app-container main #sale-container .sale-content .canvas-container .canvas-content .first-floor img, body #app-container main #sale-container .sale-content .canvas-container .canvas-content .ground-floor img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; object-fit: contain; }
html #app-container main #sale-container .sale-content .canvas-container .canvas-content .first-floor ul, html #app-container main #sale-container .sale-content .canvas-container .canvas-content .ground-floor ul, body #app-container main #sale-container .sale-content .canvas-container .canvas-content .first-floor ul, body #app-container main #sale-container .sale-content .canvas-container .canvas-content .ground-floor ul { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
html #app-container main #sale-container .sale-content .canvas-container .canvas-content .first-floor ul li, html #app-container main #sale-container .sale-content .canvas-container .canvas-content .ground-floor ul li, body #app-container main #sale-container .sale-content .canvas-container .canvas-content .first-floor ul li, body #app-container main #sale-container .sale-content .canvas-container .canvas-content .ground-floor ul li { background-color: #ffffff; padding: 10px; min-width: 100px; border-radius: 25px; cursor: pointer; position: absolute; display: inline-block; text-align: center; z-index: 2; }
html #app-container main #sale-container .sale-content .canvas-container .canvas-content .first-floor ul li::after, html #app-container main #sale-container .sale-content .canvas-container .canvas-content .ground-floor ul li::after, body #app-container main #sale-container .sale-content .canvas-container .canvas-content .first-floor ul li::after, body #app-container main #sale-container .sale-content .canvas-container .canvas-content .ground-floor ul li::after { content: ""; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid #ffffff; }
html #app-container main #sale-container .list-view, body #app-container main #sale-container .list-view { position: relative; padding: 25px 15px; background-color: #C6DBE1; display: flex; flex-direction: column; gap: 20px; }
html #app-container main #sale-container .list-view .arrow-left, html #app-container main #sale-container .list-view .arrow-right, body #app-container main #sale-container .list-view .arrow-left, body #app-container main #sale-container .list-view .arrow-right { position: absolute; top: 50%; transform: translateY(-50%); cursor: pointer; transition: opacity 0.3s ease-in-out; background-color: #ffffff; padding: 20px; border-radius: 50%; }
html #app-container main #sale-container .list-view .arrow-right, body #app-container main #sale-container .list-view .arrow-right { right: 10px; transform: translateY(-50%) rotate(180deg); }
html #app-container main #sale-container .list-view ul, body #app-container main #sale-container .list-view ul { overflow-x: auto; scroll-snap-type: x mandatory; display: flex; flex-wrap: nowrap; }
html #app-container main #sale-container .list-view ul li, body #app-container main #sale-container .list-view ul li { flex: 0 0 100%; scroll-snap-align: start; display: none; }
html #app-container main #sale-container .list-view ul li.active, body #app-container main #sale-container .list-view ul li.active { display: block; }
html #app-container main #sale-container .list-view ul li a, body #app-container main #sale-container .list-view ul li a { display: flex; flex-direction: column; align-items: center; gap: 5px; }
html #app-container main #sale-container .list-view ul li a .room-item, body #app-container main #sale-container .list-view ul li a .room-item { display: flex; align-items: center; gap: 20px; }
html #app-container main #sale-container .list-view ul li a .room-item img, body #app-container main #sale-container .list-view ul li a .room-item img { width: 120px; height: 120px; object-fit: cover; border-radius: 50%; }
html #app-container main #sale-container .list-view ul li a span, body #app-container main #sale-container .list-view ul li a span { font-family: "ArialNovaCond-Bold"; font-size: 20px; width: 100px; display: block; }
html #app-container main #sale-container .list-view ul li a span span, body #app-container main #sale-container .list-view ul li a span span { font-family: "ArialNovaCond"; }
html #app-container main #sala-container .sala-content .media-component, body #app-container main #sala-container .sala-content .media-component { position: relative; }
html #app-container main #sala-container .sala-content .sala-text-container, body #app-container main #sala-container .sala-content .sala-text-container { margin: 30px 0; display: flex; flex-direction: column; gap: 15px; }
html #app-container main #sala-container .sala-content .sala-text-container .text-highlighted p, body #app-container main #sala-container .sala-content .sala-text-container .text-highlighted p { font-family: "ArialNovaCond-Bold"; font-size: 20px; }
html #app-container main #sala-container .sala-content .sala-text-container .text-content, body #app-container main #sala-container .sala-content .sala-text-container .text-content { display: flex; flex-direction: column; gap: 15px; }
html #app-container main #sala-container .altri-reperti, body #app-container main #sala-container .altri-reperti { padding-top: 30px; background-color: #C6DBE1; display: flex; flex-direction: column; gap: 20px; }
html #app-container main #sala-container .altri-reperti ul, body #app-container main #sala-container .altri-reperti ul { padding: 0 30px; overflow-y: auto; display: flex; gap: 25px; }
html #app-container main #sala-container .altri-reperti ul li, body #app-container main #sala-container .altri-reperti ul li { margin-bottom: 45px; }
html #app-container main #sala-container .altri-reperti ul li a, body #app-container main #sala-container .altri-reperti ul li a { display: flex; flex-direction: column; align-items: center; gap: 5px; }
html #app-container main #sala-container .altri-reperti ul li a img, body #app-container main #sala-container .altri-reperti ul li a img { width: 120px; height: 120px; object-fit: cover; border: 6px solid #005D75; border-radius: 50%; box-shadow: 0px 3px 15px #00000029; }
html #app-container main #sala-container .altri-reperti ul li a span, body #app-container main #sala-container .altri-reperti ul li a span { font-family: "ArialNovaCond"; width: 100px; text-align: center; }
html #app-container main #sala-container .altri-reperti span, body #app-container main #sala-container .altri-reperti span { font-family: "ArialNovaCond-Bold"; }
html #app-container main #oggetti-container .oggetti-content ul, body #app-container main #oggetti-container .oggetti-content ul { display: flex; flex-wrap: wrap; }
html #app-container main #oggetti-container .oggetti-content ul li, body #app-container main #oggetti-container .oggetti-content ul li { width: calc((100% / 2) - 0px); margin-bottom: 45px; }
html #app-container main #oggetti-container .oggetti-content ul li a, body #app-container main #oggetti-container .oggetti-content ul li a { display: flex; flex-direction: column; align-items: center; gap: 5px; }
html #app-container main #oggetti-container .oggetti-content ul li a .circle-mask, body #app-container main #oggetti-container .oggetti-content ul li a .circle-mask { width: 120px; height: 120px; object-fit: cover; object-position: center; border: 6px solid #005D75; border-radius: 50%; box-shadow: 0px 3px 15px #00000029; overflow: hidden; }
html #app-container main #oggetti-container .oggetti-content ul li a .circle-mask img, body #app-container main #oggetti-container .oggetti-content ul li a .circle-mask img { width: 100%; height: 100%; }
html #app-container main #oggetti-container .oggetti-content ul li a span, body #app-container main #oggetti-container .oggetti-content ul li a span { width: 100px; text-align: center; }
html #app-container main #oggetto-container .oggetto-content .media-component, body #app-container main #oggetto-container .oggetto-content .media-component { position: relative; }
html #app-container main #oggetto-container .oggetto-content .oggetto-text-container, body #app-container main #oggetto-container .oggetto-content .oggetto-text-container { margin: 30px 0; display: flex; flex-direction: column; gap: 15px; }
html #app-container main #oggetto-container .oggetto-content .oggetto-text-container .text-highlighted p, body #app-container main #oggetto-container .oggetto-content .oggetto-text-container .text-highlighted p { font-family: "ArialNovaCond-Bold"; font-size: 20px; }
html #app-container main #oggetto-container .oggetto-content .oggetto-text-container .text-content, body #app-container main #oggetto-container .oggetto-content .oggetto-text-container .text-content { display: flex; flex-direction: column; gap: 15px; }
html #app-container main #oggetto-container .altri-reperti, body #app-container main #oggetto-container .altri-reperti { border-top: 6px solid #9a9a9a; padding-top: 30px; background-color: #e6e6e6; display: flex; flex-direction: column; gap: 20px; }
html #app-container main #oggetto-container .altri-reperti ul, body #app-container main #oggetto-container .altri-reperti ul { padding: 0 30px; overflow-y: auto; display: flex; gap: 25px; }
html #app-container main #oggetto-container .altri-reperti ul li, body #app-container main #oggetto-container .altri-reperti ul li { margin-bottom: 45px; }
html #app-container main #oggetto-container .altri-reperti ul li a, body #app-container main #oggetto-container .altri-reperti ul li a { display: flex; flex-direction: column; align-items: center; gap: 5px; }
html #app-container main #oggetto-container .altri-reperti ul li a img, body #app-container main #oggetto-container .altri-reperti ul li a img { width: 120px; height: 120px; object-fit: cover; border: 6px solid #646464; border-radius: 50%; box-shadow: 0px 3px 15px #00000029; }
html #app-container main #oggetto-container .altri-reperti ul li a img.colore-prima-della-centuriazione, body #app-container main #oggetto-container .altri-reperti ul li a img.colore-prima-della-centuriazione { border: 6px solid #BA2427; }
html #app-container main #oggetto-container .altri-reperti ul li a img.colore-l39agricoltura-e-l39allevamento, body #app-container main #oggetto-container .altri-reperti ul li a img.colore-l39agricoltura-e-l39allevamento { border: 6px solid #E66F2E; }
html #app-container main #oggetto-container .altri-reperti ul li a img.colore-la-casa, body #app-container main #oggetto-container .altri-reperti ul li a img.colore-la-casa { border: 6px solid #E0BC41; }
html #app-container main #oggetto-container .altri-reperti ul li a img.colore-le-attivitagrave-economiche-e-produttive, body #app-container main #oggetto-container .altri-reperti ul li a img.colore-le-attivitagrave-economiche-e-produttive { border: 6px solid #8BA83E; }
html #app-container main #oggetto-container .altri-reperti ul li a img.colore-la-centuriazione, body #app-container main #oggetto-container .altri-reperti ul li a img.colore-la-centuriazione { border: 6px solid #4E94C9; }
html #app-container main #oggetto-container .altri-reperti ul li a img.colore-sala-aldo-rossi, body #app-container main #oggetto-container .altri-reperti ul li a img.colore-sala-aldo-rossi { border: 6px solid #C6DBE1; }
html #app-container main #oggetto-container .altri-reperti ul li a span, body #app-container main #oggetto-container .altri-reperti ul li a span { width: 100px; text-align: center; }
html #app-container main #gioco-container, body #app-container main #gioco-container { display: flex; flex-direction: column; flex: 1; }
html #app-container main #gioco-container .gioco-content, body #app-container main #gioco-container .gioco-content { height: 100%; display: flex; flex-direction: column; align-items: center; gap: 20px; }
html #app-container main #gioco-container .gioco-content .list-questions-container ul, body #app-container main #gioco-container .gioco-content .list-questions-container ul { display: flex; align-items: center; justify-content: center; gap: 10px; }
html #app-container main #gioco-container .gioco-content .list-questions-container ul li, body #app-container main #gioco-container .gioco-content .list-questions-container ul li { width: 25px; height: 25px; display: flex; flex-direction: column; align-items: center; background-color: #ffffff; border: 1px solid #005D75; padding: 12px; border-radius: 50%; transition: background-color 0.3s ease; }
html #app-container main #gioco-container .gioco-content .list-questions-container ul li.correct, body #app-container main #gioco-container .gioco-content .list-questions-container ul li.correct { content: ""; background-image: url("../layout/icon-thumbs-up.svg"); background-size: 15px; background-position: center; background-repeat: no-repeat; background-color: #00B74E; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
html #app-container main #gioco-container .gioco-content .list-questions-container ul li.wrong, body #app-container main #gioco-container .gioco-content .list-questions-container ul li.wrong { content: ""; background-image: url("../layout/icon-thumbs-up.svg"); transform: rotate(180deg); background-size: 15px; background-position: center; background-repeat: no-repeat; background-color: #E60005; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
html #app-container main #gioco-container .gioco-content .list-game, body #app-container main #gioco-container .gioco-content .list-game { display: flex; flex-direction: column; flex: 1; }
html #app-container main #gioco-container .gioco-content .list-game li, body #app-container main #gioco-container .gioco-content .list-game li { height: 100%; display: flex; flex-direction: column; align-items: center; gap: 25px; }
html #app-container main #gioco-container .gioco-content .list-game li .question-container, body #app-container main #gioco-container .gioco-content .list-game li .question-container { display: flex; flex-direction: column; align-items: center; gap: 25px; }
html #app-container main #gioco-container .gioco-content .list-game li .question-container .question-image, body #app-container main #gioco-container .gioco-content .list-game li .question-container .question-image { max-height: 200px; width: 100%; }
html #app-container main #gioco-container .gioco-content .list-game li .question-container .question-image img, body #app-container main #gioco-container .gioco-content .list-game li .question-container .question-image img { width: 100%; height: 100%; object-fit: cover; }
html #app-container main #gioco-container .gioco-content .list-game li .question-container .question-content h2, body #app-container main #gioco-container .gioco-content .list-game li .question-container .question-content h2 { text-align: center; }
html #app-container main #gioco-container .gioco-content .list-game li .answer-container, body #app-container main #gioco-container .gioco-content .list-game li .answer-container { width: 100%; }
html #app-container main #gioco-container .gioco-content .list-game li .answer-container ul, body #app-container main #gioco-container .gioco-content .list-game li .answer-container ul { width: 100%; display: flex; flex-direction: column; align-items: center; gap: 10px; }
html #app-container main #gioco-container .gioco-content .list-game li .answer-container ul li, body #app-container main #gioco-container .gioco-content .list-game li .answer-container ul li { width: 100%; background-color: #e6e6e6; padding: 25px; border-radius: 15px; }
html #app-container main #gioco-container .gioco-content .list-game li .answer-container ul li.correct, body #app-container main #gioco-container .gioco-content .list-game li .answer-container ul li.correct { background: #00B74E; color: #ffffff; }
html #app-container main #gioco-container .gioco-content .list-game li .answer-container ul li.wrong, body #app-container main #gioco-container .gioco-content .list-game li .answer-container ul li.wrong { background: #E60005; }
html #app-container main #gioco-container .gioco-content .final-msg-container, body #app-container main #gioco-container .gioco-content .final-msg-container { display: none; }
html #app-container main #qrcode-container, body #app-container main #qrcode-container { flex: 1; display: flex; flex-direction: column; }
html #app-container main #qrcode-container .qrcode-content, body #app-container main #qrcode-container .qrcode-content { width: 100%; height: 100%; }
html #app-container main #qrcode-container .qrcode-content .qr-overlay, body #app-container main #qrcode-container .qrcode-content .qr-overlay { background-color: #ffffff !important; width: 100%; height: 100%; }
html #app-container main #qrcode-container .qrcode-content .qr-overlay .qr-overlay-content, body #app-container main #qrcode-container .qrcode-content .qr-overlay .qr-overlay-content { display: flex; justify-content: center; align-items: center; position: absolute; z-index: 2; width: 100%; top: 25%; }
html #app-container main #qrcode-container .qrcode-content .qr-overlay .qr-overlay-content h1, body #app-container main #qrcode-container .qrcode-content .qr-overlay .qr-overlay-content h1 { color: #ffffff; }
html #app-container main #qrcode-container .qrcode-content .qr-overlay #reader, body #app-container main #qrcode-container .qrcode-content .qr-overlay #reader { background-color: #ffffff !important; width: 100% !important; height: 100% !important; }
html #app-container main #qrcode-container .qrcode-content .qr-overlay #reader video, body #app-container main #qrcode-container .qrcode-content .qr-overlay #reader video { width: 100% !important; height: 100% !important; object-fit: cover; }
html #app-container main #qrcode-container .qrcode-content .qr-overlay #reader #qr-shaded-region, body #app-container main #qrcode-container .qrcode-content .qr-overlay #reader #qr-shaded-region { border-color: transparent !important; }
html #app-container main .gallery-container, body #app-container main .gallery-container { display: block; position: relative; width: 100%; aspect-ratio: 16/9; background-color: #e6e6e6; }
html #app-container main .gallery-container ul.images-gallery, body #app-container main .gallery-container ul.images-gallery { display: block; scroll-snap-type: x mandatory; width: 100%; height: 100%; margin: 0 auto; white-space: nowrap; overflow-x: auto; overflow-y: hidden; }
html #app-container main .gallery-container ul.images-gallery::-webkit-scrollbar, body #app-container main .gallery-container ul.images-gallery::-webkit-scrollbar { width: 0; height: 0; }
html #app-container main .gallery-container ul.images-gallery li, body #app-container main .gallery-container ul.images-gallery li { display: inline-block; position: relative; scroll-snap-align: center; scroll-snap-stop: always; width: 100%; height: 100%; }
html #app-container main .gallery-container ul.images-gallery li video, body #app-container main .gallery-container ul.images-gallery li video { display: block; width: 100%; height: 100%; max-height: 250px; object-fit: cover; object-position: center; }
html #app-container main .gallery-container ul.images-gallery li img, body #app-container main .gallery-container ul.images-gallery li img { display: block; width: 100%; height: 100%; max-height: 250px; object-fit: cover; object-position: center; }
html #app-container main .gallery-container ul.pagination-gallery, body #app-container main .gallery-container ul.pagination-gallery { display: flex; align-items: center; justify-content: center; width: 100%; height: 80px; text-align: center; background-color: #e6e6e6; }
html #app-container main .gallery-container ul.pagination-gallery li, body #app-container main .gallery-container ul.pagination-gallery li { display: inline-block; width: 6px; height: 6px; margin: 0px 5px; border-radius: 100%; background-color: rgba(0, 93, 117, 0.6); }
html #app-container main .gallery-container ul.pagination-gallery li.selected, body #app-container main .gallery-container ul.pagination-gallery li.selected { width: 8px; height: 8px; background-color: #005D75; }
html #app-container main.no-video .info-text-container, body #app-container main.no-video .info-text-container { text-align: justify; }
html #app-container main.no-video img, body #app-container main.no-video img { width: 100%; height: auto; }
html #app-container main .video-lis-container, body #app-container main .video-lis-container { display: block; position: relative; width: 100%; aspect-ratio: 16/9; background-color: #e6e6e6; }
html #app-container main .video-lis-container video, body #app-container main .video-lis-container video { display: block; width: 100%; height: 100%; max-height: 205px; object-fit: cover; object-position: center; }
html #app-container main .audio-container, body #app-container main .audio-container { display: flex; align-items: center; justify-content: center; position: absolute; bottom: 0; width: 100%; height: 80px; background-color: transparent; }
html #app-container main .audio-container .player-container, body #app-container main .audio-container .player-container { width: 225px; }
html #app-container main .audio-container .player-container .audio-player, body #app-container main .audio-container .player-container .audio-player { display: flex; align-items: center; background-color: #005D75; margin-right: 15px; margin-left: -15px; border-radius: 0px 15px 15px 0px; width: 0px; height: 25px; box-shadow: 0px 5px 10px #00000029; transition: 0.5s; }
html #app-container main .audio-container .player-container .audio-player audio, body #app-container main .audio-container .player-container .audio-player audio { display: none; }
html #app-container main .audio-container .player-container .audio-player .controls, body #app-container main .audio-container .player-container .audio-player .controls { display: flex; align-items: center; width: 100%; color: #ffffff; padding: 15px; overflow: hidden; }
html #app-container main .audio-container .player-container .audio-player .controls #play-pause, body #app-container main .audio-container .player-container .audio-player .controls #play-pause { background: none; border: none; color: #ffffff; font-size: 16px; margin-right: 10px; cursor: pointer; }
html #app-container main .audio-container .player-container .audio-player .controls .progress-container, body #app-container main .audio-container .player-container .audio-player .controls .progress-container { position: relative; width: 100%; height: 3px; background-color: #ffffff; border-radius: calc(8px / 2); overflow: hidden; margin: 0 10px; }
html #app-container main .audio-container .player-container .audio-player .controls .progress-container .progress-bar, body #app-container main .audio-container .player-container .audio-player .controls .progress-container .progress-bar { width: 0; height: 100%; background-color: #E0BC41; }
html #app-container main .audio-container .player-container .audio-player .controls #current-time, html #app-container main .audio-container .player-container .audio-player .controls #duration, body #app-container main .audio-container .player-container .audio-player .controls #current-time, body #app-container main .audio-container .player-container .audio-player .controls #duration { font-family: "ArialNovaCond-Italic"; font-size: 10px; color: #ffffff; }
html #app-container main .lis-container .lis-player, body #app-container main .lis-container .lis-player { display: none; position: fixed; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; background-color: #005D75; z-index: 99; }
html #app-container main .lis-container .lis-player video, body #app-container main .lis-container .lis-player video { width: 100%; height: 100%; object-fit: contain; object-position: center; }
html #app-container main .accordion-text a, body #app-container main .accordion-text a { text-decoration: underline; text-decoration-thickness: 2px; }
html #app-container main .accordion-text a p, body #app-container main .accordion-text a p { font-family: "ArialNovaCond-Bold"; margin-bottom: 15px; }
html #app-container main .accordion-text .box-text, body #app-container main .accordion-text .box-text { display: flex; flex-direction: column; gap: 15px; }
html #app-container main #dialog-container, body #app-container main #dialog-container { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 999; display: none; flex-direction: column; align-items: center; justify-content: center; background-color: rgba(0, 93, 117, 0.9); backdrop-filter: blur(10px); }
html #app-container main #dialog-container .time-picker, body #app-container main #dialog-container .time-picker { width: 80%; display: flex; flex-direction: column; align-items: center; justify-content: space-around; gap: 20px; background-color: #f8f8f8; padding: 40px 15px; border-radius: 20px; }
html #app-container main #dialog-container .time-picker .time-picker_question, body #app-container main #dialog-container .time-picker .time-picker_question { text-align: center; }
html #app-container main #dialog-container .time-picker .time-picker_question span, body #app-container main #dialog-container .time-picker .time-picker_question span { font-family: "ArialNovaCond-Bold"; font-size: 26px; line-height: 28px; }
html #app-container main #dialog-container .time-picker .time-picker_options, body #app-container main #dialog-container .time-picker .time-picker_options { width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 50px; }
html #app-container main #dialog-container .time-picker .time-picker_options .time-option, body #app-container main #dialog-container .time-picker .time-picker_options .time-option { width: 100%; border-radius: 14px; font-weight: 800; padding: 20px; border: none; font-size: 18px; font-family: "ArialNovaCond-Bold"; }
html #app-container main #dialog-container .time-picker .alternative-path, body #app-container main #dialog-container .time-picker .alternative-path { width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: space-between; gap: 10px; }
html #app-container main #dialog-container .time-picker .alternative-path .alternative-path_text, body #app-container main #dialog-container .time-picker .alternative-path .alternative-path_text { text-align: center; }
html #app-container main #dialog-container .time-picker .alternative-path .alternative-path_text span, body #app-container main #dialog-container .time-picker .alternative-path .alternative-path_text span { font-size: 26px; line-height: 28px; font-family: "ArialNovaCond-Bold"; }
html #app-container main #dialog-container .time-picker .alternative-path .kids-path, body #app-container main #dialog-container .time-picker .alternative-path .kids-path { width: 100%; border-radius: 14px; font-weight: 800; padding: 20px; border: none; font-size: 18px; font-family: "ArialNovaCond-Bold"; color: #ffffff; background-image: url("../layout/kids-path.png"); background-position: center; background-size: cover; }
html #app-container main #dialog-container.active, body #app-container main #dialog-container.active { display: flex; }
html #app-container #offcanvas, body #app-container #offcanvas { /* Side navigation menu */ height: 100%; width: 0; position: fixed; z-index: 3; top: 0; right: 0; background-color: #005D75; overflow-x: hidden; padding-top: 60px; transition: 0.5s; white-space: nowrap; }
html #app-container #offcanvas ul, body #app-container #offcanvas ul { display: flex; flex-direction: column; gap: 18px; }
html #app-container #offcanvas ul li, body #app-container #offcanvas ul li { padding: 8px 32px; }
html #app-container #offcanvas ul li a, body #app-container #offcanvas ul li a { color: #ffffff; text-decoration-line: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; display: block; transition: color 0.3s; }
@media screen and (max-height: 450px) { html #app-container #offcanvas ul li, body #app-container #offcanvas ul li { padding-top: 15px; }
  html #app-container #offcanvas ul li a, body #app-container #offcanvas ul li a { font-size: 18px; } }
html #app-container #offcanvas ul li#home, body #app-container #offcanvas ul li#home { display: flex; justify-content: space-between; align-items: center; }
html #app-container #offcanvas ul li#home a, body #app-container #offcanvas ul li#home a { color: #005D75; background: #ffffff; padding: 10px 15px; border-radius: 25px; text-decoration: none; display: flex; align-items: center; justify-content: center; }
html #app-container #offcanvas ul li#home a::before, body #app-container #offcanvas ul li#home a::before { display: block; content: ""; background-image: url("../layout/house-solid.svg"); background-position: center center; background-repeat: no-repeat; background-size: 20px; width: 20px; height: 20px; padding-left: 5px; }
html #app-container #offcanvas ul li#home a h1, body #app-container #offcanvas ul li#home a h1 { font-family: "ArialNovaCond"; font-size: 15px; }
html #app-container #offcanvas ul li#switchLang a, body #app-container #offcanvas ul li#switchLang a { content: ""; background-position: center; background-repeat: no-repeat; background-size: cover; border: 3px solid #ffffff; width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; cursor: pointer; text-decoration: none; transition: color 0.3s; background-color: #005D75; color: #ffffff; padding: 15px; border-radius: 50%; font-family: "Abril"; font-size: 28px; box-shadow: 0px 3px 15px #00000029; }
html #app-container #offcanvas ul li#switchLang a.en, body #app-container #offcanvas ul li#switchLang a.en { background-image: url("../layout/eng-flag.png"); }
html #app-container #offcanvas ul li#switchLang a.it, body #app-container #offcanvas ul li#switchLang a.it { background-image: url("../layout/it-flag.png"); }
html #app-container #offcanvas ul li .closebtn, body #app-container #offcanvas ul li .closebtn { background: transparent !important; display: block; content: ""; }
html #app-container #offcanvas ul li .closebtn::before, body #app-container #offcanvas ul li .closebtn::before { display: block; content: ""; background-image: url("../layout/icon-btn_close.svg") !important; background-position: center center; background-repeat: no-repeat; background-size: 15px !important; width: 15px; height: 15px; padding-left: 0px !important; }
html #app-container #menu-buttons #info-crediti-button, body #app-container #menu-buttons #info-crediti-button { position: absolute; top: 52px; left: 30px; width: 45px; height: 45px; display: flex; align-items: center; justify-content: center; cursor: pointer; text-decoration: none; transition: color 0.3s; background-color: #005D75; color: #ffffff; padding: 15px; border-radius: 50%; font-family: "Abril"; font-size: 28px; box-shadow: 0px 3px 15px #00000029; }
html #app-container #menu-buttons #openMenu, body #app-container #menu-buttons #openMenu { position: absolute; top: 52px; right: 0; display: flex; align-items: center; justify-content: center; cursor: pointer; text-decoration: none; transition: color 0.3s; background-color: #005D75; color: #ffffff; padding: 15px; border-radius: 25px 0px 0px 25px; box-shadow: 0px 3px 15px #00000029; }
html #app-container #menu-buttons #openMenu::after, body #app-container #menu-buttons #openMenu::after { display: block; content: ""; background-image: url("../layout/bars-solid.svg") !important; background-position: center center; background-repeat: no-repeat; background-size: 15px !important; width: 15px; height: 15px; padding-left: 15px; }

a { text-decoration: none; color: #414141; }

sup { font-size: 0.7em; line-height: 1em; vertical-align: top; }

i, em { font-style: italic; }

b, strong { font-family: "ArialNovaCond-Bold"; }

h1 { font-family: "ArialNovaCond-Bold"; font-size: 26px; letter-spacing: 0px; line-height: 28px; }

h2 { font-family: "ArialNovaCond-Bold"; font-size: 20px; letter-spacing: 0px; line-height: 28px; }

p, span, li { font-family: "ArialNovaCond"; font-size: 17px; letter-spacing: 0px; line-height: 18px; }