body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	/*font-family: "Helvetica", "Arial", sans-serif;*/
	font-family: Arial, Helvetica, sans-serif;
	font-size:2.0vw;
	color:#FFF;
	text-rendering: optimizeLegibility;
	font-weight: 300;
	background-color: #191919;
	
	/*width: 100%;*/
	/*background-image: url("../grafica/sfondo.png");*/ /* The image used */
	/*height: 1920px;*/ /* You must set a specified height */
	/*background-position: center;*/ /* Center the image */
	/*background-repeat: no-repeat;*/ /* Do not repeat the image */
	/*background-attachment: fixed;*/
	/*background-size: contain;*/ /* Resize the background image to cover the entire container */
}

/*
@media only screen and (max-width: 980px) {
	body {
		background-color: #FF0000;
	}
}
@media only screen and (min-width: 980px) {
	body {
		background-color: #0F0;
	}
}
*/




/* STILI PER HEADER ---------------------------------------------------------------------------------------------------------------------------------------------- */
.header {
  background-color: #191919;
  padding: 0px;
  
  position: sticky;
  top: 0;
  z-index: 100;
  
  text-align:center;
}



.testata {
	display: block;
	margin-left: auto;
	margin-right: auto;
	padding-top: -20px;
	/*height: 6vh;
	width: 45vh;*/
	width: 100%;
	background-color: white;
	/*max-width: 439px;*/
}






/* STILI PER NAVIGAZIONE PRINCIPALE ---------------------------------------------------------------------------------------------------------------------------------------------- */
.mobile-nav {
  background: #777777;
  position: fixed;
  bottom: 0;
  /*height: 10vh;*/
  width: 100%;
  display: flex;
  justify-content: space-around;
  border-top: 10px solid #AF0821;
}

@media only screen and (max-width: 599px) {
	.mobile-nav {
	  height: 10vh;
	}	
} 

@media only screen and (min-width: 600px) {
	.mobile-nav {
	  height: 14vh;
	}	
}


/* STILI PER NAVIGAZIONE PRINCIPALE - PER SCHEDE REALTA' AUMENTATA ---------------------------------------------------------------------------------------------------------------------------------------------- */
.mobile-nav-ar {
  /*background: #FF0000;*/
  position: fixed;
  bottom: 0;
  /*height: 10vh;*/
  width: 100%;
  display: flex;
  justify-content: space-around;
  /*border-top: 10px solid #AF0821;*/
  z-index: 9999
}

@media only screen and (max-width: 599px) {
	.mobile-nav-ar {
	  height: 10vh;
	}	
} 

@media only screen and (min-width: 600px) {
	.mobile-nav-ar {
	  height: 14vh;
	}	
} 




/* navigazione LINGUE --------------------------------- */
.bloc-icon-lang {
  display: flex;
  justify-content: center;
  align-items: center;
  /*background-color:#0F0;*/
  cursor: pointer;
}


.bloc-icon-lang img {
  width: 15vw;
  /*border-radius: 30px;*/
  /*background: #DDDDDD;*/
}

.btn-active-lang img{
  background: #777777;
  border
}



/* navigazione SEZIONI CONTENUTI --------------------------------- */
.bloc-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  /*background-color:#0F0;*/
  cursor: pointer;
}

.bloc-icon img {
  width: 15vw;
  /*border-radius: 30px;*/
  background:#777777;
}

.bloc-icon-tracingitalianroots {
  display: flex;
  justify-content: center;
  align-items: center;
  /*background-color:#0F0;*/
  cursor: pointer;
}

.bloc-icon-tracingitalianroots img {
  width: 30vw;
  /*border-radius: 30px;*/
  background:#777777;
}

.btn-active img{
  background: #777777;
}

/*@media screen and (min-width: 600px) {
  .mobile-nav {
  display: none;
  }
}*/



/* navigazione SEZIONI CONTENUTI SCHEDE REALTA' AUMENTATA --------------------------------- */
.bloc-icon-ar {
  display: flex;
  justify-content: center;
  align-items: center;
  /*background-color:#0F0;*/
  cursor: pointer;
}

.bloc-icon-ar img {
  width: 15vw;
  /*border-radius: 30px;*/
  /*background:#777777;*/
}

.btn-active-ar img{
  /*background: #777777;*/
}

/*@media screen and (min-width: 600px) {
  .mobile-nav {
  display: none;
  }
}*/





/* STILI PER CONTENUTO ---------------------------------------------------------------------------------------------------------------------------------------------- */
.content{
	padding: 0px 10px 0px 10px;
	/*margin-bottom: 150px;*/
}

@media only screen and (max-width: 599px) {
	.content{
		margin-bottom: 120px;
	}
} 

@media only screen and (min-width: 600px) {
	.content{
		margin-bottom: 180px;
	}	
}

/* iPad Pro */
@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
	.content{
		margin-bottom: 250px;
	}
}




.contentMappe{
	padding: 0px 0px 0px 0px;
	/*margin-bottom: 150px;*/
}

.contentPuntiMappaScheda{
	padding: 0px 10px 0px 10px;
	/*margin-bottom: 200px;*/
}


.contentTitolo{
	/*background: #FF0000;*/
	width: 100%;
	text-align:left;
	font-size:5.0vw;
	text-rendering: optimizeLegibility;
	font-weight: bold;
	margin: 0px 0px 10px 0px;
}

.contentLuogo{
	/*background: #FF0000;*/
	width: 100%;
	text-align:left;
	font-size:4.0vw;
	text-rendering: optimizeLegibility;
	font-weight: bold;
	margin: 0px 0px 10px 0px;
}

.contentTitoloIconaContainer{
	/*width: 96vw;
	height: 100px;
	background: #FF0000;
	text-align:left;*/
	/*margin-bottom: 50px;*/
}

@media only screen and (max-width: 599px) {
	.contentTitoloIconaContainer{
		margin-bottom: 60px;
		/*color:#F0F;*/
	}
} 

@media only screen and (min-width: 600px) {
	.contentTitoloIconaContainer{
		margin-bottom: 90px;
		/*color:#F00;*/
	}	
}

/* iPad Pro */
@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
	.contentTitoloIconaContainer{
		margin-bottom: 110px;
		/*color:#0F0;*/
	}
}



.contentTitoloIcona{
	width: 81vw;
	float: left;
	/*background: #FF0000;*/
	text-align:left;
	font-size:4.2vw;
	text-rendering: optimizeLegibility;
	/*font-weight: bold;*/
	margin: 3px 0px 10px 0px;
}

.contentTitoloIconaImmagine{
	width: 81vw;
	height: 7vw;
	float: left;
	/*background: #FF0000;*/
	text-align:left;
	font-size:4.2vw;
	text-rendering: optimizeLegibility;
	/*font-weight: bold;*/
	margin: 3px 0px 10px 0px;
	padding-top: 3px;
}



.contentDate{
	/*background: #FF0000;*/
	width: 100%;
	text-align:left;
	font-size:4.0vw;
	font-style: italic;
	text-rendering: optimizeLegibility;
	/*font-weight: bold;*/
	margin: 0px 0px 10px 0px;
}



.contentIcona{
	/*background:#0F0;*/
	width: 9vw;
	float: left;
	font-size: 2.5em;
}

.contentIconaImmagine{
	/*background:#0F0;*/
	width: 9vw;
	float: left;
	font-size: 2.5em;
}

.IconaImmagine{
	height: 6vw;
	width: 6vw;
}

.contentTesto{
	/*background: #FF0000;*/
	width: 100%;
	text-align:left;
	font-size:4.0vw;
	text-rendering: optimizeLegibility;
	margin-bottom: 20px;
}

.contentBanner{
	/*background: #FF0000;*/
	width: 100%;
	text-align:center;
	margin: 10px 0px 10px 0px;
}

.contentImmagine{
	/*background: #FF0000;*/
	width: 100%;
	text-align:center;
	margin-bottom: 20px;
}

.contentImmagine img{
  width: 100%;
  /*max-width: 500px;*/
}





/* STILI PER SERVIZI ---------------------------------------------------------------------------------------------------------------------------------------------- */
	.serviziElencoItem{
		display: inline-block;
		position:relative;
		/*background-color:rgba(255, 255, 255, 0.7);*/ /* bianco */
		/*border-bottom: 1px solid black;*/*/
	}
	
	

@media only screen and (max-width: 599px) {
	.serviziElencoItem{
		/*height:60px;*/
		/*background-color:rgba(0, 0, 255, 0.7);*/ /* blu */
	}
} 

@media only screen and (min-width: 600px) {
	.serviziElencoItem{
		/*height:80px;*/
		/*background-color:rgba(115, 220, 0, 0.7);*/ /* verde */
	}	
}
	
	
	
	
/* iPad Pro */
@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
	  
	.serviziElencoItem{
		/*height:130px;*/
		/*background-color:rgba(255, 0, 255, 0.7);*/ /* viola */
	}

}
	
	
	
	
	.serviziElencoTitolo{
		width: 80vw;
		float: left;
		/*background: #FF0000;*/
		text-align:left;
		font-size:4.5vw;
		text-rendering: optimizeLegibility;
		/*font-weight: bold;*/
		margin: 0px 0px 28px 0px;
		padding-top: 8px;
		color:#FFF;
	}
	
	.serviziElencoIcona{
		/*background:#0F0;*/
		width: 12vw;
		float: left;
	}
	
	.serviziElencoIcona img{
		width: 9vw;
	}
	


	.serviziTitolo{
		width: 34vw;
		float: left;
		/*background: #FF0000;*/
		text-align:left;
		font-size:4.5vw;
		text-rendering: optimizeLegibility;
		/*font-weight: bold;*/
		margin: 0px 0px 25px 0px;
		padding-top: 8px;
		color:#FFF;
	}
	
	.serviziIcona{
		/*background:#0F0;*/
		width: 12vw;
		float: left;
	}
	
	.serviziIcona img{
		width: 9vw;
	}




@media only screen and (max-width: 599px) {
	.serviziTastiContainer{
		margin: 30px 0px 00px 0px;
		padding-bottom: 70px;
	}
} 

@media only screen and (min-width: 600px) {
	.serviziTastiContainer{
		margin: 30px 0px 00px 0px;
		padding-bottom: 90px;
	}	
}
	
	
	
	
/* iPad Pro */
@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
	  
	.serviziTastiContainer{
		margin: 30px 0px 00px 0px;
		padding-bottom: 90px;
	}

}	






	
	.serviziTasti{
		width:50%;
		float:left;
		/*height:70px;*/
		/*background:blue; */
		margin: 0;
	}
	

@media only screen and (max-width: 599px) {
	.serviziTasti{
		height:70px;
		/*background-color:rgba(0, 0, 255, 0.7);*/ /* blu */
	}
} 

@media only screen and (min-width: 600px) {
	.serviziTasti{
		height:90px;
		/*background-color:rgba(115, 220, 0, 0.7);*/ /* verde */
	}	
}
	
/* iPad Pro */
@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
	  
	.serviziTasti{
		height:120px;
		/*background-color:rgba(255, 0, 255, 0.7);*/ /* viola */
	}

}
	
	
	.PuntiMappaiTastiContainer{
		margin: 30px 0px 100px 0px;
		padding-bottom: 100px;
	}
	
	.PuntiMappaTasti{
		width:50%;
		float:left;
		height:70px; 
		/*background:blue; */
		margin: 0;
	}
	

/* STILI PER PREFERITI ---------------------------------------------------------------------------------------------------------------------------------------------- */
@media only screen and (max-width: 599px) {
	.preferitiContainer{
		/*background-color:rgba(0, 0, 255, 1);*/ /* blu */
		display:inline-block;
		padding-bottom: 2px;
	}
} 

@media only screen and (min-width: 600px) {
	.preferitiContainer{
		/*background-color:rgba(115, 220, 0, 1);*/ /* verde */
		display:inline-block;
		padding-bottom: 20px;
	}	
}
	
/* iPad Pro */
@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
	  
	.preferitiContainer{
		/*background-color:rgba(255, 0, 255, 1);*/ /* viola */
		display:inline-block;
		padding-bottom: 20px;
	}

}


	.preferitiElencoTitolo{
		width: 68vw;
		float: left;
		/*background: #FF0000;*/
		text-align:left;
		font-size:4.5vw;
		text-rendering: optimizeLegibility;
		/*font-weight: bold;*/
		margin: 0px 0px 28px 0px;
		padding-top: 8px;
		color:#FFF;
	}
	
	.preferitiElencoIcona{
		/*background:#0F0;*/
		width: 12vw;
		float: left;
	}
	
	.preferitiElencoIcona img{
		width: 9vw;
	}

	
	.preferitiElencoCestino{
	/*background:#00F;*/
	width: 12vw;
	float: left;
	text-align:right;
	font-size: 4.0em;
}





/* STILI PER SCHEDA PUNTI MAPPA ---------------------------------------------------------------------------------------------------------------------------------------------- */
	.puntiMappaElencoTitolo{
		width: 80vw;
		float: left;
		/*background: #FF0000;*/
		text-align:left;
		font-size:4.5vw;
		text-rendering: optimizeLegibility;
		/*font-weight: bold;*/
		margin: 0px 0px 28px 0px;
		padding-top: 8px;
		color:#FFF;
	}
	
	.puntiMappaElencoIcona{
		/*background:#0F0;*/
		width: 12vw;
		float: left;
	}
	
	.puntiMappaElencoIcona img{
		width: 9vw;
	}
	


	.puntiMappaTitolo{
		width: 34vw;
		float: left;
		/*background: #FF0000;*/
		text-align:left;
		font-size:4.5vw;
		text-rendering: optimizeLegibility;
		/*font-weight: bold;*/
		margin: 0px 0px 25px 0px;
		padding-top: 8px;
		color:#FFF;
	}
	
	.puntiMappaIcona{
		/*background:#0F0;*/
		width: 12vw;
		float: left;
	}
	
	.puntiMappaIcona img{
		width: 9vw;
	}
	
	.puntiMappaTasti{
		width:50%;
		float:left;
		/*height:70px; */
		/*background:blue; */
		margin: 0;
	}
	
	.puntiMappaTastiQrcode{
		width:100%;
		float:left;
		/*height:70px; */
		/*background:blue; */
		margin: 0;
	}
	

@media only screen and (max-width: 599px) {
	.puntiMappaTastiContainer{
		/*margin: 30px 0px 150px 0px;*/
		/*padding-bottom: 150px;*/
		display:inline-block;
	}
	
	.puntiMappaTasti{
		height:70px;
		/*background-color:rgba(0, 0, 255, 0.7);*/ /* blu */
	}
	
	.MargineTastiMappa{
		height:0px;
		/*background-color:rgba(0, 0, 255, 0.7);*/ /* blu */
	}
} 

@media only screen and (min-width: 600px) {
	.puntiMappaTastiContainer{
		/*margin: 30px 0px 150px 0px;*/
		/*padding-bottom: 200px;*/
		display:inline-block;
	}

	.puntiMappaTasti{
		height:90px;
		/*background-color:rgba(115, 220, 0, 0.7);*/ /* verde */
	}
	
	.MargineTastiMappa{
		/*height:600px;*/
		height:20px;
		/*background-color:rgba(115, 220, 0, 0.7);*/ /* verde */
	}
}
	
/* iPad Pro */
@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
	  
	.puntiMappaTastiContainer{
		/*margin: 30px 0px 150px 0px;*/
		/*padding-bottom: 200px;*/
		display:inline-block;
	}
	  
	.puntiMappaTasti{
		height:140px;
		/*background-color:rgba(255, 0, 255, 0.7);*/ /* viola */
	}
	
	.MargineTastiMappa{
		/*height:800px;*/
		height:20px;
		/*background-color:rgba(255, 0, 255, 0.7);*/ /* viola */
	}

}







#istruzioni3darTesto {
  background-color:#AF0821;
  font-family: Arial, Helvetica, sans-serif;
  /*font-size:2.5vw;*/
  font-weight: bold;
  color:#FFF;
  /*padding-left: 13vw;
  padding-right: 5vw;*/
  margin: 0px 0px 0px 0px;
  text-align:center;
}

#istruzioni3darImg {
  margin: 10px 0px 20px 0px;
  text-align:center;
}

@media only screen and (max-width: 599px) {
	#istruzioni3darTesto{
		font-size:4.0vw;
		padding: 2vw 2vw 2vw 2vw;
	}
} 

@media only screen and (min-width: 600px) {
	#istruzioni3darTesto{
		font-size:2.5vw;
		padding: 2vw 2vw 2vw 2vw;
	}	
}

/* iPad Pro */
@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
	#istruzioni3darTesto{
		font-size:2.5vw;
		padding: 2vw 2vw 2vw 2vw;
	}
}






	



/* FONT ---------------------------------------------------------------------------------------------------------------------------------------------- */

@font-face {
    font-family: 'paquitaregular';
    src: url('../font/paquita-webfont.eot'); /* IE 6+ */
    src: url('../font/paquita-webfont.eot?#iefix') format('embedded-opentype'), /* IE 6+ */
         url('../font/paquita-webfont.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
         url('../font/paquita-webfont.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
         url('../font/paquita-webfont.svg#paquitaregular') format('svg');
    font-weight: normal;
    font-style: normal;
}











#ios-install-prompt {
    position: fixed;
    bottom: 20px;
    left: 10px;
    right: 10px;
    background-color: white;
    color: #333;
    padding: 15px;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(255,255,255,0.2);
    display: none; /* Nascosto di default */
    z-index: 9999;
    font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto;
}

#ios-install-prompt p {
    margin: 0 0 10px 0;
    font-size: 14px;
    line-height: 1.4;
}

.install-icons {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-weight: bold;
}

/* Icona stilizzata di Safari Share */
.share-icon {
    width: 24px;
    height: 24px;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="%23007AFF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"/><polyline points="16 6 12 2 8 6"/><line x1="12" y1="2" x2="12" y2="15"/></svg>') no-repeat center;
}

body {
    /* Impedisce al contenuto di finire "sotto" la tacca (notch) o l'orario */
    padding-top: env(safe-area-inset-top);
    background-color: #191919; /* Sostituisci con il colore della tua testata */
}



/* Stile del pulsante */
.bounce-button {
    margin: 20px auto;
    padding: 18px;
    background-color: #AF0821;
    color: white;
    border-radius: 12px;
    text-align: center;
    cursor: pointer;
    font-weight: bold;
    font-size: 1.1rem;
    box-shadow: 0 10px 20px rgba(255,255,255,0.2);
    width: 90%;
    max-width: 400px;
    transition: transform 0.2s ease;
}

/* Effetto al tocco */
.bounce-button:active {
    transform: scale(0.95);
}

/* Animazione del pulsante (Rimbalzo leggero) */
.bounce-button {
    animation: bounce 2s infinite;
}

@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
    40% {transform: translateY(-10px);}
    60% {transform: translateY(-5px);}
}

/* Animazione della freccia */
.arrow-down {
    display: inline-block;
    margin-left: 10px;
    font-size: 1.3rem;
}


#pwa-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.85); 
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000; /* Assicurati che sia sopra ogni altro elemento */
}

/* Box del Modal piu largo e spazioso */
#pwa-modal-content {
    background-color: #777777;
    padding: 40px 20px;
    border-radius: 24px;
    width: 90%; /* Occupa quasi tutta la larghezza */
    max-width: 450px;
    text-align: center;
    box-shadow: 0 20px 40px rgba(255,255,255,0.4);
    font-family: sans-serif;
}

/* Pulsante Extra Large */
.btn-install-xl {
    background-color: #AF0821;
    color: white;
    border: none;
    padding: 25px 10px; /* Molto alto */
    border-radius: 15px;
    font-size: 26px; /* Font enorme */
    font-weight: 900; /* Super grassetto */
    width: 100%;
    cursor: pointer;
    text-transform: uppercase;
    /*box-shadow: 0 1px 15px rgba(255,255,255, 0.5);*/
    transition: background-color 0.3s;
}

.btn-install-xl:active {
    background-color: #FFFFFF;
    transform: scale(0.98);
}

/* Pulsante principale grande */
.btn-install-main {
    background-color: #AF0821;
    color: white;
    border: none;
    padding: 20px 10px; /* Piu spazio interno */
    border-radius: 50px;
    font-size: 22px; /* Font bello grande */
    font-weight: bold;
    width: 100%;
    cursor: pointer;
    display: flex; /* Allinea testo e freccia */
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(40, 167, 69, 0.4);
}

/* Animazione di apparizione */
.bounce-modal {
    animation: modalShow 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

@keyframes modalShow {
    from { transform: scale(0.7); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

/* Animazione specifica per la freccia iOS */
.ios-arrow-bounce {
    animation: iosBounce 1.5s infinite;
    color: #007AFF;
    font-weight: bold;
}

@keyframes iosBounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(10px); }
}