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

@font-face {
    font-family: 'Avenir Medium';
    src: url('../font/AvenirLTStd-Medium.eot');
    src: url('../font/AvenirLTStd-Medium.eot?#iefix') format('embedded-opentype'),
         url('../font/AvenirLTStd-Medium.woff2') format('woff2'),
         url('../font/AvenirLTStd-Medium.woff') format('woff'),
         url('../font/AvenirLTStd-Medium.ttf') format('truetype'),
         url('../font/AvenirLTStd-Medium.svg#AvenirLTStd-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Avenir Book';
    src: url('../font/AvenirLTStd-Book.eot');
    src: url('../font/AvenirLTStd-Book.eot?#iefix') format('embedded-opentype'),
         url('../font/AvenirLTStd-Book.woff2') format('woff2'),
         url('../font/AvenirLTStd-Book.woff') format('woff'),
         url('../font/AvenirLTStd-Book.ttf') format('truetype'),
         url('../font/AvenirLTStd-Book.svg#AvenirLTStd-Book') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}




body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	font-family: Avenir Book;
	color: #1C7380;
	background-color: #F7F7F7;
	
	/*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 */
}



a:link {
	color: #1C7380;
	text-decoration: none;
}
a:visited {
	color: #1C7380;
	text-decoration: none;
}
a:hover {
	color: #1C7380;
	text-decoration: none;
}
a:active {
	color: #1C7380;
	text-decoration: none;
}





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



@media only screen and (orientation:portrait){
	.testata {
		width: 100vw;
	}
}

@media only screen and (orientation:landscape){
	.testata {
		width: 40vw;
	}
}









@media only screen and (orientation:portrait){
	/* STILI PER NAVIGAZIONE PRINCIPALE ---------------------------------------------------------------------------------------------------------------------------------------------- */
	.mobile-nav {
	  background: #CCA3D4;
	  position: fixed;
	  bottom: 0;
	  /*height: 180px;*/
	  height: 20vw;
	  width: 100%;
	  display: flex;
	  justify-content: space-around;
	}


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


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

	.btn-active-lang img{
	  /*width: 140px;*/
	  width: 15vw;
	  /*border-radius: 30px;
	  background: #042842;*/
	}



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

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

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

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

@media only screen and (orientation:landscape){
	/* STILI PER NAVIGAZIONE PRINCIPALE ---------------------------------------------------------------------------------------------------------------------------------------------- */
	.mobile-nav {
	  background: #CCA3D4;
	  position: fixed;
	  bottom: 0;
	  /*height: 80px;*/
	  height: 15vh;
	  width: 100%;
	  display: flex;
	  justify-content: space-around;
	}


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


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

	.btn-active-lang img{
	  /*width: 60px;*/
	  width: 6vw;
	  /*border-radius: 30px;
	  background: #042842;*/
	}



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

	.bloc-icon img {
	  /*width: 60px;*/
	  width: 6vw;
	  /*border-radius: 30px;
	  background:#999999;*/
	}

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

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

}












/* STILI PER CONTENUTO ---------------------------------------------------------------------------------------------------------------------------------------------- */
@media only screen and (orientation:portrait){
	.content{
		/*padding: 20px 20px 20px 20px;*/
		padding: 2vh 3vw 2vh 3vw;
		margin-bottom: 150px;
		/*background: #FF0000;*/
	}
	
	.contentMappa{
		/*padding: 20px 20px 20px 20px;*/
		padding: 2vh 3vw 2vh 3vw;
		margin-bottom: 150px;
		/*background: #FF0000;*/
	}

	.contentTitolo{
		width: 100%;
		text-align:left;
		font-family: Avenir Medium;
		font-size:5.0vw;
		line-height:5.0vw;
		font-weight: bold;
		margin: 10px 0px 10px 0px;
		/*background: #FF0;*/
	}

	.contentMappaTitolo{
		width: 100%;
		text-align:left;
		font-family: Avenir Medium;
		font-size:5.0vw;
		line-height:5.0vw;
		font-weight: bold;
		margin: 20px 0px 20px 0px;
		/*background: #FF0;*/
	}
	
	.contentPercorso{
		width: 100%;
		text-align:left;
		font-family: Avenir Medium;
		font-size:3.0vw;
		line-height:3.0vw;
		font-weight: bold;
		margin: 10px 0px 0px 0px;
		/*color:#CC0000;*/
		/*background: #FF0;*/
	}
	
	.contentTesto{
		width: 100%;
		text-align:left;
		font-family: Avenir Book;
		font-size:4.5vw;
		line-height:5.0vw;
		margin-bottom: 20px;
	}
	
	.contentImmagine{
		/*background: #FF0000;*/
		width: 100%;
		text-align:center;
		margin-bottom: 20px;
	}
	
	.contentImmagine img{
	  width: 100%;
	  /*max-width: 500px;*/
	}
	
	.contentMappa img{
	  width: 100%;
	  /*max-width: 500px;*/
	}
	
	.elencoScultori{
		/*font-size:5.2vw;
		font-weight: bold;*/
		font-size: 20px;
	}
}

@media only screen and (orientation:landscape){
	.content{
		/*padding: 20px 20px 20px 20px;*/
		padding: 3vh 2vw 3vh 2vw;
		margin-bottom: 150px;
	}
	
	.contentMappa{
		/*padding: 20px 20px 20px 20px;*/
		padding: 2vh 3vw 2vh 3vw;
		margin-bottom: 150px;
		/*background: #FF0000;*/
	}

	.contentTitolo{
		/*background: #FF0000;*/
		width: 100%;
		text-align:left;
		font-family: Avenir Medium;
		font-size:3.0vw;
		line-height:3.0vw;
		font-weight: bold;
		margin: 10px 0px 10px 0px;
	}

	.contentMappaTitolo{
		width: 100%;
		text-align:left;
		font-family: Avenir Medium;
		font-size:3.0vw;
		line-height:3.0vw;
		font-weight: bold;
		margin: 20px 0px 20px 0px;
		/*background: #FF0;*/
	}
	
	.contentPercorso{
		width: 100%;
		text-align:left;
		font-family: Avenir Medium;
		font-size:2.0vw;
		line-height:2.0vw;
		font-weight: bold;
		margin: 10px 0px 10px 0px;
		/*color:#CC0000;*/
		/*background: #FF0;*/
	}
	
	.contentTesto{
		/*background: #FF0000;*/
		width: 100%;
		text-align:left;
		font-family: Avenir Book;
		font-size:2.0vw;
		line-height:2.5vw;
		margin-bottom: 20px;
	}
	
	.contentImmagine{
		/*background: #FF0000;*/
		width: 100%;
		text-align:center;
		margin-bottom: 20px;
	}
	
	.contentImmagine img{
	  width: 100%;
	  max-width: 500px;
	}
	
	.elencoScultori{
		/*font-size:3.2vw;
		font-weight: bold;*/
		font-size: 20px;
	}
}











/* ELENCHI ---------------------------------------------------------------------------------------------------------------------------------------------- */
@media only screen and (orientation:portrait){
	.elenco {
	  border-collapse: collapse;
	  width: 100%;
	}
	
	.elencoCol1{
	  width:12vw;
	  padding:15px 0px 0px 0px;
	}
	
	.elencoCol2{
	  width:88vw;
	  padding:15px 0px 0px 0px;
	}
	
	.elenco td, .elenco th {
	  /*border: 1px solid #ddd;*/
	  border: none;
	  padding: 8px;
	}
	
	.elenco th {
	  padding-top: 12px;
	  padding-bottom: 12px;
	  text-align: left;
	  /*background-color: #04AA6D;*/
	  color: white;
	}
	
	.elenco img {
	  width: 40px;
	}
}

@media only screen and (orientation:landscape){
	.elenco {
	  border-collapse: collapse;
	  width: 100%;
	}
	
	.elencoCol1{
	  width:4vw;
	  padding:15px 0px 0px 0px;
	}
	
	.elencoCol2{
	  width:96vw;
	  padding:15px 0px 0px 0px;
	}
	
	.elenco td, .elenco th {
	  /*border: 1px solid #ddd;*/
	  border: none;
	  padding: 8px;
	}
	
	.elenco th {
	  padding-top: 12px;
	  padding-bottom: 12px;
	  text-align: left;
	  /*background-color: #04AA6D;*/
	  color: white;
	}
	
	.elenco img {
	  width: 40px;
	}
}







/* MAPPE - The Modal (background)  ---------------------------------------------------------------------------------------------------------------------------------------------- */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 10px;
  border: 3px solid #1C7380;
  width: 60%;
}

/* The Close Button */
.close01, .close02, .close03, .close04, .close05, .close06, .close07, .close08, .close09, .close10, .close11, .close12, .close13, .close14, .close15, .close16, .close17, .close18, .close19, .close20, .close21, .close22, .close23, .close24, .close25, .close26, .close27, .close28, .close29, .close30, .close31, .close32, .close33, .close34, .close35 {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close01:hover, .close02:hover, .close03:hover, .close04:hover, .close05:hover, .close06:hover, .close07:hover, .close08:hover, .close09:hover, .close10:hover, .close11:hover, .close12:hover, .close13:hover, .close14:hover, .close15:hover, .close16:hover, .close17:hover, .close18:hover, .close19:hover, .close20:hover, .close21:hover, .close22:hover, .close23:hover, .close24:hover, .close25:hover, .close26:hover, .close27:hover, .close28:hover, .close29:hover, .close30:hover, .close31:hover, .close32:hover, .close33:hover, .close34:hover, .close35:hover,
.close01:focus, .close02:focus, .close03:focus, .close04:focus, .close05:focus, .close06:focus, .close07:focus, .close08:focus, .close09:focus, .close10:focus, .close11:focus, .close12:focus, .close13:focus, .close14:focus, .close15:focus, .close16:focus, .close17:focus, .close18:focus, .close19:focus, .close20:focus, .close21:focus, .close22:focus, .close23:focus, .close24:focus, .close25:focus, .close26:focus, .close27:focus, .close28:focus, .close29:focus, .close30:focus, .close31:focus, .close32:focus, .close33:focus, .close34:focus, .close35:focus  {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.linkScheda{
	font-size:3.0vw;
	font-weight: bold;
}