@import url(https://fonts.googleapis.com/css?family=Droid+Serif:400,700italic);,
@import url(https://fonts.googleapis.com/css?family=Noto+Sans:400,700),
        url(https://fonts.googleapis.com/css?family=Sanchez:400italic,400),
        url(https://fonts.googleapis.com/css?family=Roboto:100),
		url(https://fonts.googleapis.com/css?family=Oswald&display=swap),
		url(https://fonts.googleapis.com/css?family=Lato&display=swap);
@import url("naschover.css");  
/* CSS Document */

*{ box-sizing: border-box;
 }
/*** -------------------------------------------------------------------------------------------------------INDEX ***/
 
html, body {
  overflow-x: hidden;
} 
body {
	text-align:center; background:url(../immagini/bg.gif) repeat #044576; font-family: 'Lato', sans-serif; margin:0; }

a {
 color:#003366; text-decoration:underline;
}

a:hover {
color:#CE0000; text-decoration:none;
}
#nascosto {display:none;}
.nascosto {display:none;}

/* Lists */
ul {
  margin: 0;
  padding: 0;
}

.pushy, .menu-btn {display:none;}


.w3-row{background-color: #FFFFFF;}

/*** -------------------------- Header ***/
header {
width:100%; height:155px; padding:0px; margin:0px; background:url(../immagini/header.jpg) no-repeat right 0px #00345e; text-align: left;
}
/*** -------------------------- Menu e Logo ***/
.header-logo{
height:142px; width:265px; background:url(../immagini/logo.png) 0px 18px no-repeat; margin-left: 20px; float:left; display:block;
}
.header-text{
display: block; float: left; margin:8px 0 0 10px; font-size:15px; color:#FFFFFF; font-family:verdana, Arial, Helvetica, sans-serif; font-style:italic; font-weight:bold; line-height: 19px;}


/*** -------------------------- Menu e Logo ***/

.w3-content{
background:#FFF; max-width:86%;
}
/*** -------------------------- Menu rosso ***/

#cssmenu ul li a.menuiscriviti{color:#CE0000; }  /*menu principale hover*/
#cssmenu ul li a.menuiscriviti:hover{background-color:#CE0000; color:#FFFFFF; }  /*menu principale hover*/

/*** --------------------------------------- classi ***/
.intro{
	 font-weight: bolder; font-style: italic; text-align: justify; margin:10px 0; color:#333333; font-size: 1.20em; line-height: 1.25em;
}

.size1-1{	 font-size:1.1em;}
.size1-5{	 font-size:1.5em;}
.size1-8{	 font-size:1.8em; line-height: 1.4em;}
.size2{	 font-size:2em; line-height: 1.3em; margin-bottom: 10px;}

.tit-rosso	{
	  font-weight: bolder; color: #CE0000;
	}
	
.tit-bianco{
	   font-style:italic; color:#FFFFFF;  
}

.tit-blu{
	  font-style:italic; color:#003366;  
}
.tit-grigio{
	  font-style:italic; color:#666666;  padding:8px 15px; 
}
.centrato{
	text-align:center;}

.titolino {
	font-size:0.7em; font-weight: bolder; font-style: italic; 
	}
.downpdf, .box-more, .frecciarossa{
	width: 100%; color:#333227; text-align:left; font:0.9em; text-decoration:none;  font-weight:bold; float:left; padding-left:10px; margin:0 65px 10px 0;
	}
 .downpdf a{text-decoration: none;}	
/*** --------------------------------------- pagine ***/
section {
	background:#FFF; 
	margin:5px 0 0 0;
	padding: 20px 0 40px 0;
	border-right:solid 5px #14335f;
}

section h1{
	font-size:1.4em; font-weight: bold; font-family: 'Oswald', sans-serif; background:#003366;
	height: auto; line-height: 1.5em;
    width: 100%; padding: 9px 0px;
    margin-bottom: 10px;
    float: left; 
    color: #FFF; 
    box-shadow: 5px 5px 2px -2px #a5a5a5;
	
	-webkit-bo-shadow:0 0 9px #00345e;
	-moz-box-shadow:0 0 9px #00345e;
	box-shadow:0 0 6px #00345e;	
 
}
.sfondo-blu{  background-image: linear-gradient(#336699, #003366); color:#FFF;
}
.sfondo-rosso{  background-image: linear-gradient(#cc0033, #ff3333); color: #FFF;
}

section h2{
	width:100%; font-size:1.2em;  font-style: oblique; font-weight: bolder; color: #003366; text-align:center;	display:block;   float: left;
}
section h3{
	width:100%; float: left; font-size:1.1em; font-style:oblique; font-weight:bolder; color:#FFFFFF; background:#003366; padding:10px 0px 10px 25px; text-align:left; 
		-moz-border-radius:5px;
	border-radius:5px;

}
section h5{
 font-family: 'Droid Serif', serif; font-size:1.3em; font-weight:bolder; color:#CE0000; margin-left:70px; margin-right:70px; display:block; border-bottom:2px solid #CE0000; padding-bottom:5px; margin-bottom:6px; text-align: left;
}
section p{
	font-size:1.1em; text-align:justify; margin:8px 2% 15px; line-height:1.4em;
	}
.section-row {
width: 100%; height: auto; padding: 10px; float: left;}

/*----------------------------------------------------------------------------------BOX MESSAGGI MAIN ***/
.dicono{
	  background:#d1eefe; width:100%;  height:470x; float:left; margin:25px 0px; text-align: left; 
}

[class*="sfondo-titolo-"]{ width:100%;  float:left; display:block; font-weight: bolder; padding-left: 8px;  }

.sfondo-titolo-rosso{ background:url(../immagini/sfondo-rosso-titoli.png) repeat-x 0px 0px; }
.sfondo-titolo-blu{ background:url(../immagini/sfondo-blu-titoli.png) repeat-x 0px 0px; }

ul.box-dicono{
float:left; width:98%; padding:15px 0 15px 0px; margin:2px 1%;
	} 
ul.box-dicono li{
	list-style:none; padding:8px;} 

.box-dicono-riga{ width:100%;  float:left;
	} 

ul.box-dicono li.dicono-utente{
float:left; width:14%; color:#FFFFFF; font-weight:900; background:#333333; height:40; 
} 

ul.box-dicono li.dicono-mex{  
float:left;  background:#f6db89; width:85%; color:#000c24;  margin-bottom:10px;	border-left:6px solid #FFFFFF; text-align: justify; font-size:1.1em;
}
a.continua{
	background:url(../immagini/ico-avanti.png) no-repeat 0px 0px; color:#003366; margin-left:5px;
	font-size:0.8em; text-decoration:none; font-weight:bold; padding-left:20px; height:30px;
	}

ul.elenco{
	  display:block; width: 100%; float: left; list-style:none; margin:10px 0px 15px 0px;   padding-left:0px; 
	}
ul.elenco li{
	  display:block; padding:12px 10px 12px 56px; margin-bottom:10px; background:url(../immagini/ico-freccia.png) no-repeat 10px 8px #ebebeb; color:#003366; text-align: left; font-size: 1.15em; line-height: 1.25em; }

ul.elenco li a{ text-decoration: none;}
/*---------------------------------------------------------------------------------- STRISCIA   ***/

[class*="striscia-"]{ width:100%; padding:20px 0px; float:left; display:block; }
.striscia-blu{
 background:url(../immagini/bg.gif) repeat #044576; margin-top:30px;   }

.striscia-bianca{
 background:#FFF; margin-top: 20px;   }


.anni-img, .anni-text{ text-align: center; height:auto; float:left;   display: block;
}
.anni-text{  width:58%;
}
.anni-img{ width:38%;
}
/*----------------------------------------------------------------------------------BOX NELLE PAGINE ***/


.box {
	width:100%; float:left; text-align:left; margin:10px 0px 25px;  height:auto; padding:0px; 
	-webkit-bo-shadow:0 0 9px #00345e;
	-moz-box-shadow:0 0 9px #00345e;
	box-shadow:0 0 6px #00345e;
		
	-moz-border-radius:8px;
	border-radius:8px;
}

.box h1, .misurare h1{ width: 100%; float: left; margin:0px auto 10px auto; text-align: left; padding-left: 8px; line-height: 1em;}

.box-imgsx{ height:auto; float:left; padding:8px; width:auto; margin:0px 8px; 
}
.box-imgdx{ height:auto; float:right; padding:8px; width:auto; margin:0px 8px;  
}
.box-text{ width: auto; padding:8px; 
}
img.img-center {
    max-width:100%; height:auto; object-fit: contain;
}
.box-more-old a{
	 color:#003366; background:url(../immagini/ico-info.png) no-repeat 10px 0px;  text-decoration:none; font-weight:bold; display:block; padding:7px 0 7px 48px; width:100%; float:left; margin:0px 0px 15px 0px; font-size: 1.0em;
	}
.box-more-old a:hover, .box-up a:hover, a.continua:hover, .box-news a:hover, a.notizie2:hover, .downpdf a:hover {
	filter: alpha (opacity=60); opacity: .6;  font-weight:bold;	
	}

.box-up a{
	 width:auto;  height:22px; background:url(../immagini/up.png) no-repeat 0px 3px; color:#333227; float:right; margin:0 20px 25px 0; font-size:14px;   text-decoration:none; font-weight:bold;  padding:2px 0 7px 23px; 
}
.box ol { float:left; margin:5px; width: 65%;
}
.box ol li{ font-size: 1.15em; margin-bottom: 10px;
}
.box-news a{
	 color:#003366; background:url(../immagini/ico-info.png) no-repeat 0px;  text-decoration:none; font-weight:bold; display:block; padding:7px 0 7px 40px; width:105px; float:left; margin:0px 0px 15px 0px; font-size: 1.0em;
	}
a.notizie2{
	width:4px; margin:0px; padding-left:12px; float:left; text-decoration:none; font-weight:bold;  background:none; text-align: left;
	}

/*---------------------------------------------------------------------------------- Blockquote ***/

.box-grigio {
  padding:10px 10px 18px 10px; width: 90%; margin: 20px 5%; display: block; float: left;
  box-shadow: 
       inset 0 -3em 3em rgba(0,0,0,0.1), 
             0 0  0 2px rgb(255,255,255),
             0.3em 0.3em 1em rgba(0,0,0,0.3);
}
.frecciarossa-old a{
	width: 100%; background:url(../immagini/avanti.gif) no-repeat 0 4px; color:#333227; text-align:left;
	font:0.9em; text-decoration:none; font-family: 'Sanchez', serif; font-size: 1em; font-weight:bold; float:left; padding-left:20px; margin:0 65px 10px 0;
	}
.frecciarossa-old a:hover{
	background:url(../immagini/avanti2.gif) no-repeat 0 4px;
}

blockquote{
  padding:5px;  font-family: 'Sanchez', serif; font-size: 1.3em; line-height: 1.4em; font-style: italic;
}

 .msg-tit:before, .msg-tit:after {
  display: inline-block;
  vertical-align: top;
  height: 30px;
  line-height: 48px;
  font-size: 50px;
  opacity: .2;
}

.msg-tit:before {
  content: '\201C';
  margin-right: 4px;
  margin-left: -8px;
}

.msg-tit:after {
  content: '\201D';
  margin-left: 4px;
  margin-right: -8px;
}

cite {
  display: block;
  padding-right: 10px;
  text-align: left;
  font-size: 1.1em; font-style: normal;
  font-family: 'Lato', serif; font-weight: 700;
  color: #CE0000;
	border-bottom: 2px solid #CE0000;
}
/*---------------------------------------------------------------------------------- FONDO PAGINE ***/
.fondopag{
	  display:block; width:100%; float:left; margin:30px 0px 80px 0px; /*centra negli altri browsers*/
	} 

.fondopag1{
	font-weight: bold; text-transform: uppercase; font-size: 1.2em; text-decoration: none;
	height: auto; padding: 22px 0px;
    line-height: 1.2em;
    width: 42%; margin: 0px 4%;
    border-radius: 50px;
    float: left;
    color: #FFF; 
    box-shadow: 5px 5px 2px -2px #a5a5a5;
	
	-webkit-bo-shadow:0 0 9px #00345e;
	-moz-box-shadow:0 0 9px #00345e;
	box-shadow:0 0 6px #00345e;	
	-moz-border-radius:8px;
	border-radius:8px;
}
.fondopag1:hover{  background-image: linear-gradient(#ff3333, #cc0033); color: #FFF;
}
.fas{ 
	   padding: 5px; margin-left: 0px; display: inline;   
}


/*---------  ***/
.test-finto	{
	 width: 130px; height:160px; background:url(../immagini/test-finto.png) no-repeat; vertical-align: middle;
 
	}
.test-finto .btn-testimonials{
	/* Style the button and place it in the middle of the container/image */

  background-color: #555;
  color: white;
  font-size: 0.9em;
  padding: 12px;
  border: none;
  cursor: pointer;
  border-radius: 5px;
}

.test-finto .btn-testimonials:hover{
  background-color: #cc0033;
}
 
.boxcentrale {
	width:80%;  display:block; height:auto; text-align:center;  margin:0px 10% 0px 10%; 
}


	/*------------------------------------------------------------------------ ***/
	


/*---------------------------------------------------------------------------------------------------prefooter-------------------*/

.prefooter{
	background:#00345e; display:block; width:100%;  height:230px;  float:left; font-family:Arial, Helvetica, sans-serif; padding:10px 0px 10px 25px;  /*centra negli altri browsers*/
	} 
.prefooter a{
	 color:#FFFFFF; float:left; font:Arial, Helvetica, sans-serif;   text-decoration:none;
	}

.prefooter ul{
	width:20%; margin:0px; float:left;  padding:0px;  color:#FFFFFF; list-style: none;
	} 
.prefooter ul li{
	 color:#FFFFFF; width:100%; float:left; 
	}
.prefooter ul li a{
	 color:#FFFFFF; 
	}	
.prefooter ul li a:hover{
	 color:#FFFFFF; text-decoration:underline;  
	}		
.prefooter ul li a.submenu{
	 color:#CEFFFF; font-size:11px; 
	}	
.prefooter ul li.annoforum{
	 width:110px; float:left; font-size:11px; 
	}	
.prefooter ul li a.annoforum{
	 color:#CEFFFF; font-size:11px;  
	}		
.prefooter ul li a.spaziosotto{
height:30px; font-weight: }	

.prefooter ul li a.prefooter-tit{
font-weight: bold; font-size:13px;}	

.prefooter ul.socialpages{
width:13%; margin-left:5%;	}

.prefooter ul.socialpages li{
padding-bottom:5px;
	}
	
/*---------------------------------------------------------------------------------------------------footer-------------------*/

footer{
	margin-top:6px; background-color:#043053; padding:6px 0; font-size: 11px;
	 text-align:center; font-family:'Trebuchet MS', Arial, Helvetica, sans-serif;  color:#FFFFFF;
	 }
	
footer a:hover{
	text-decoration:underline; color:#FFFFFF;
	}
footer a{
	text-decoration:none; color:#FFFFFF;
	} 
   

/*** --------------------------------------------- TUTTI FORM  ------------------------------- ***/

fieldset{
border:0px #FFF; padding: 0px; margin: 0px; 
} 

input[type="submit"]{ margin:20px 0px; letter-spacing: 1px;
	font-weight: bold; text-transform: uppercase; font-size: 1.2em; text-decoration: none;
	height: auto; padding: 22px 0px;
    line-height: 1.1em;
    width: 30%;  
    border-radius: 50px;
    float: left;
    color: #FFF; 
    box-shadow: 5px 5px 2px -2px #a5a5a5;
 
	-webkit-bo-shadow:0 0 9px #00345e;
	-moz-box-shadow:0 0 9px #00345e;
	box-shadow:0 0 6px #00345e;	
	-moz-border-radius:8px;
	border-radius:8px;
}

input[type="submit"]:hover{  background-image: linear-gradient(#ff3333, #cc0033); color: #FFF;
}

/*** --------------------------------------------- FORM CONTATTI ------------------------------- ***/
.form-contatti{
	width: 90%; float: left; margin: 25px 5%; 
}

.formcontatti label{
float:left; font-weight:bold; font:0,8em; text-align: left; margin-top: 10px;
/*width of left column*/
width: 100%; /*width of labels. Should be smaller than left column (155px) to create some right margin*/
}

.formcontatti input[type="text"], .formcontatti select, .formcontatti textarea{ /*width of text boxes. IE6 does not understand this attribute*/
   margin:4px 0px 10px 0px; width: 100%; float: none; font-size:1em; border:0px; color:#666; padding:8px 15px;  
			
	-webkit-bo-shadow:0 0 3px #00345e;
	-moz-box-shadow:0 0 3px #00345e;
	box-shadow:0 0 1px #00345e;
		
	-moz-border-radius:8px;
	border-radius:8px;
}
.formcontatti input:blur{ /*width of text boxes. IE6 does not understand this attribute*/
   color: #9D9D9D;
}




/*** ---------------------------------------------FORM ISCRIVITI ------------------------------- ***/
.formiscriviti {text-align: left;}

.formiscriviti  h3{
	width:100%; font-size:1.2em; font-style:oblique; font-weight:bolder; color:#FFFFFF; padding:7px 1%;	background:#00345e; display:block; text-align:left; border:0px; margin:0px 0px 10px; float: left;
}

.formiscriviti label{
float:left; font-weight:900; font:1em; text-align: left;
margin-left: 15px; /*width of left column*/
width: 150px; /*width of labels. Should be smaller than left column (155px) to create some right margin*/
}

.formiscriviti input[type="text"], .formiscriviti input[type="password"], .formiscriviti input[type="date"]{ /*width of text boxes. IE6 does not understand this attribute*/
   margin:0px 0px 12px 0px;  font-weight:bold; overflow: hidden; width:250px; font-size:1.1em; border: 0px;  color:#666; padding:5px; float: none; 
			
	-webkit-bo-shadow:0 0 3px #00345e;
	-moz-box-shadow:0 0 3px #00345e;
	box-shadow:0 0 1px #00345e;
	-moz-border-radius:8px;
	border-radius:8px;
}

.formiscriviti input.validation-failed, textarea.validation-failed { /*bordo errore*/
	border: 1px solid #CE0000;
	color : #FF3300;
}
 
.formiscriviti label.error { /*bordo errore*/
width: 210px;
float: none; padding:0 0 8px 5px; color: #ce0000;
 font-size:0.8em;
}
.formiscriviti label.success { /*bordo errore*/
background:url(../immagini/checked.png) no-repeat 0px 0px; padding-left: 16px;
}

input[type="checkbox"]{ /*width of text boxes. IE6 does not understand this attribute*/
	width:30px; height:30px; margin-bottom:8px; border:1px #000 solid; color:#555; padding:0px; 
	
	-webkit-bo-shadow:0 0 3px #00345e;
	-moz-box-shadow:0 0 3px #00345e;
	box-shadow:0 0 1px #00345e;

	-moz-border-radius:8px;
	border-radius:8px;
}

.fa-times-circle{font-size:14px; color:#ce0000; margin-right:3px; 
}

.formiscriviti input.required, textarea.required { /*bordo azzurro*/
border: 1px solid #00A8E6; 
width: 180px;
height:22px;
margin-bottom:8px;
}

.formiscriviti label { 
font-weight:bold;
}

/*** --------------------------------------------- FORM PAYPAL ------------------------------- ***/
.formpaypal{
	width: 90%; float: left; margin: 25px 5%; 
}

.formpaypal label{
float:left; font-weight:900; font:1em; text-align: left;
margin-left: 15px; /*width of left column*/
width: 150px; /*width of labels. Should be smaller than left column (155px) to create some right margin*/
}

.formpaypal input[type="text"], .formpaypal input[type="password"], .formpaypal input[type="date"]{ /*width of text boxes. IE6 does not understand this attribute*/
   margin:0px 0px 12px 0px;  font-weight:bold; overflow: hidden; width:250px;
font-size:1.1em; border: 0px;  color:#666; padding:5px; float: none; 
			
	-webkit-bo-shadow:0 0 3px #00345e;
	-moz-box-shadow:0 0 3px #00345e;
	box-shadow:0 0 1px #00345e;
	-moz-border-radius:8px;
	border-radius:8px;
}
.formpaypal input:blur{ /*width of text boxes. IE6 does not understand this attribute*/
   color: #9D9D9D;
}






/***-------------------------------------------------------------------------------------BOX PAGAMENTI  ***/
.login {
	width:600px;  height:auto; display:block; float:left; margin:10px 50px;
}
/***-------------------------------------------------------------------------------------BOX PAGAMENTI  ***/

#pagamenti ul{
	height:190px; padding:0px; margin:10px 0px 0px 14px; padding-top:15px; list-style-type:none; background:#FFFFFF; width:95%;
	}
#pagamenti ul li{
	float:left;  height:190px; background:none; padding:0px; text-align:center;
	}
#pagamenti ul li a{
	font-size:13px; font-weight:bold; height:190px; display:block; color:#003366;
	text-decoration:none;
	}
#pagamenti ul li a:hover{
	  height:190px; display:block; color:#003366;
	text-decoration:underline;  filter: alpha (opacity=50); opacity: .5;	
	}
	

	
	
	

/***-------------------------------------------------------------------------------------/*menu a destra dentro corpo*/


sidenav {
    height: 100%; display: block;
    z-index: 1;
	padding:20px 0px;
    margin:0px 0px;  
	background:#FFF;
 
}

sidenav ul{
	padding:0px;
	}
sidenav ul li{
	list-style:none;
	}
sidenav ul.menudxelenco{
	width:90%; height: auto; padding:15px 0px 5px 0px; margin: 0px auto; display:block; border: 1px solid #cccccc;
	}
sidenav ul.menudxelenco li, sidenav ul.menudxelenco li img{
	text-align:center; font-size:14px;
	}
sidenav ul.menudxelenco li a{
	text-align:center; font-size:16px; padding:1px 0 2px 0;  
	}
sidenav ul.menudxelenco li a:hover{
	  color:#CE0000;  
	}				
sidenav ul li a{
	 display:block; list-style:none; font-size:16px; font-weight:bolder; text-align:left;  text-decoration:none;
	}
sidenav img{
padding-left:2px; text-align: center;
}
sidenav ul.banner li{
	 margin-bottom:20px;   
	}
	
.menusidenav{ color:#CE0000; width: 90%;  text-align:left; border: 1px solid #cccccc;  margin:10px auto; font-size: 16x; padding-left: 10%; line-height: 40px; font-weight: bold;
}
.menusidenav span a{  color:#CE0000; text-decoration: none; 
}
.menusidenav span a:hover{  color:#003366;  
}

.btn-3{  background-image: linear-gradient(#fbf7f7, #f1eded);  
}

.fa{ 
  width: 30px;
  height: 30px; 
  border-radius: 50%;
  border: 2px solid #CE0000;
  margin-right: 10px; padding: 5px;  
  text-align: center;
}
	
.chat{
	color:#cc0033; font-size: 0.8em;
	}
 .fa-comments{font-size: 1em; color:#cc0033; margin-left:3px; border: none;
}


/* Accordions - pg. tour_4*/
.acc_holder {
}
.acc_item {
	padding: 12px 0px;
	margin: 0px 0 0;
	position: relative;
	cursor: pointer;
	-webkit-transition: all 0.3s linear;
	-moz-transition: all 0.3s linear;
	-ms-transition: all 0.3s linear;
	-o-transition: all 0.3s linear;
	transition: all 0.3s linear;
	background: #fff;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-khtml-border-radius: 4px;
	border-radius: 4px;
}
.acc_item:hover {
	background: #f8f8f8;
}
.acc_control {
	float: left;
	background: #778185 url(../immagini/acc_bgr.png) 0px -18px no-repeat;
	width: 18px;
	height: 18px;
	margin: 0 14px 0px 8px;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear;
	-o-transition: all 0.2s linear;
	transition: all 0.2s linear;
	-moz-border-radius: 17px;
	-webkit-border-radius: 17px;
	-khtml-border-radius: 17px;
	border-radius: 17px;
}
.active_acc .acc_control {
 background: #778185 url(../immagini/acc_bgr.png) 0px 0px no-repeat;
}
.acc_heading {
	display: block;
	margin-left: 40px;
}
.accordion {
	padding: 0px;
	margin: 0;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear;
	-o-transition: all 0.2s linear;
	transition: all 0.2s linear;
	font-size: 1.1em; text-align: left;
	font-weight:600;
	line-height: 18px;
}
.accordion.active_acc {
 background:url(../immagini/acc_bgr.png) 0px 0px no-repeat;
}
.accordion_content {
	display: none;
	padding: 10px 20px;
	color: #222222;
}	
	



/*** POP UP - Stili relative alla finestra modale e contenuti ***/

.close-window a{  background-image: linear-gradient(#336699, #003366); color:#FFF;
	font-size:1em; font-weight: bold; font-family: 'Oswald', sans-serif; background:#003366;
	height: auto; line-height: 1.5em; 
    width: 98%; padding:9px 9px; text-align: center;
    margin:40px 0;
    float: left; text-decoration: none; 
    box-shadow: 5px 5px 2px -2px #a5a5a5;
	
	-webkit-bo-shadow:0 0 9px #00345e;
	-moz-box-shadow:0 0 9px #00345e;
	box-shadow:0 0 6px #00345e;	
}
 .close-window a:hover{  background-image: linear-gradient(#ff3333, #cc0033); color: #FFF;
}

.fa.fa-window-close{border:none; 
	}

.popup h1,
.popup h2,
.popup h3 {
color: #008000;
text-shadow: 0 1px 3px rgba(0,0,0,.3);
font-weight: normal;
}
.popup h1 { /* titolo 1 */
font-size:24px;
}
.popup h2 { /* titolo 2 */
font-size: 1.5em;
}
.popup h3 { /* titolo3 3 */
font-size: 1.2em;
}
/* Stili di base di ombreggiatura e finestra modale  */
.overlay {
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 9999;
visibility: hidden;
/* sfondo oscurante */
background-color: rgba(0, 0, 0, 0.7);
opacity: 0;
position: fixed; /* posizionamento fisso */
cursor: default; /* tipo del cursore */
-webkit-transition: all 0.6s;
-moz-transition: all 0.6s;
-ms-transition: all 0.6s;
-o-transition: all 0.6s;
transition: all 0.6s;
}
.overlay:target {
visibility: visible;
opacity: 1;
}

/* Stili delle finestre modali */
.popup {
top: 0;
right: 0;
left: 50%;
font-size: 14px;
font-family: 'Tahoma', Arial, sans-serif;
z-index: 10000;
margin: 0 auto;
width: 100%;
min-width: 320px;
max-width: 820px;
/* Posizionamento fisso, finestra rimane icolata allo scorimento della pagina */
position: fixed;
padding: 15px;
border: 1px solid #383838;
/* arrotondamento dei angoli */
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
border-radius: 4px;
background-color: #FFFFFF;
/* ombra esetrna */
-webkit-box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3);
-moz-box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3);
-ms-box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3);
-o-box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3);
box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3);
/* trasformazioni */
-webkit-transform: translate(-50%, -150%);
-ms-transform: translate(-50%, -150%);
-o-transform: translate(-50%, -150%);
transform: translate(-50%, -150%);
/* trasformazioni animate */
-webkit-transition: transform 0.6s ease-out;
-moz-transition: transform 0.6s ease-out;
-ms-transition: transform 0.6s ease-out;
-o-transition: transform 0.6s ease-out;
transition: transform 0.6s ease-out;
}
/* attivimo la finestra popup */
.overlay:target+.popup {
top: 50%;
-webkit-transform: translate(-50%,-50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
/* realizzimo il bottone della chiusura */
.close {
position: absolute;
padding: 0;
top: -10px;
right: -10px;
width: 22px;
height: 22px;
border: 2px solid #ccc;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
border-radius: 50%;
background-color: rgba(61, 61, 61, 0.8);
-webkit-box-shadow: 0px 0px 10px #000;
-moz-box-shadow: 0px 0px 10px #000;
box-shadow: 0px 0px 10px #000;
text-align: center;
text-decoration: none;
font-weight: bold;
line-height: 20px;
-webkit-transition: background-color ease .7s;
-moz-transition:  background-color ease .7s;
-ms-transition:  background-color ease .7s;
-o-transition:  background-color ease .7s;
transition: background-color ease .7s;
}
.close:before {
color: rgba(255, 255, 255, 0.9);
content: '\2715';
text-shadow: 0 -1px rgba(0, 0, 0, 0.9);
font-size: 12px;
 
}

.close:hover {
background-color: rgba(252, 20, 0, 0.8);
}
.popup p {
margin: 0;
padding: 10px;
}
/* tablet */
@media only screen and (min-width: 768px) and (max-width: 959px) {
	.popup {
		width: 95%;
	}
}
/* smartfone*/
@media only screen and (min-width: 320px) and (max-width: 767px) {
	.popup {
		width:85%;
	}
}
/* immagine al inetrno della finestra */
.popup img {
display: block;
border: none;
width: 100%;
height: auto;
}
/* miniature destra /sinistra */
.pic-left, 
.pic-right {
    width: 25%;
    height: auto;
}
.pic-left {
    float: left;
    margin: 5px 15px 5px 0;
}
.pic-right {
    float: right;
    margin: 5px 0 5px 15px;
}
/* elementi multuimediali incorporati, frame */
/* blocon con video addativo */
.video { 
position: relative; 
padding-bottom: 56.25%; 
height: 0; 
overflow:hidden; 
} 
.video iframe, 
.video object, 
.video embed {
position: absolute; 
top: 0; 
left: 0; 
width: 100%;
height: 100%; 
}