@charset "utf-8";
/*4 colori logo dal più scuro al più chiaro rgb(45, 33, 115) rgb(1, 96, 160)  rgb(1, 153, 202)  rgb(140, 210, 244)*/
html{
	width: 100%;
	height: 100%;
	height: auto;
	font-family: 'Roboto', sans-serif;
	color:#172351;
	overflow-y: scroll;	
	}
::-webkit-scrollbar {
  width: 10px;
}
/* Track */
::-webkit-scrollbar-track {
  background: rgba(20,18,78,0.20); 
} 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #dfe2e7; 
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: rgba(20,18,78,0.50); 
}
a{
	text-decoration: none;
}
.a_link:hover{
	text-decoration:underline;
}
.disable{
	pointer-events: none;
	opacity:0.5;
}
.soloDisab{
	pointer-events: none;	
}
.hidden{display: none!important}
button:focus {
  outline: none;
  box-shadow: none;
}
.curPoint{
	cursor: pointer;
}
.biancoNero {
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><fecolormatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'></fecolormatrix></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
}
.seppia{filter: sepia(100%)}

.sfumato{	
  color: gray; /* fix for not webkit browsers */
  background: -webkit-linear-gradient(#58bcdc 40%, #797faf 60%);
  background: -o-linear-gradient(#58bcdc 40%, #797faf 60%);
  background: linear-gradient(#58bcdc 40%, #797faf 60%);
  background-size: cover;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;	
	margin-bottom: 0;
}
.sfumatoNegozi{	
  	color: #ededed; /* fix for not webkit browsers */
  background: -webkit-linear-gradient(#0199ca 40%, #ededed 60%);
  background: -o-linear-gradient(#0199ca 40%, #ededed 60%);
  background: linear-gradient(#0199ca 40%, #ededed 60%);
  	background-size: cover;
  	-webkit-background-clip: text;
  	-webkit-text-fill-color: transparent;
  	background-clip: text;
  	text-fill-color: transparent;
	opacity: .66;
	margin-bottom: 0;
}
_:-ms-lang(x), .sfumato, .sfumatoNegozi { color: #626E88; background: none}
body{	
	margin: 0 auto;
	padding: 0;	
	height: 100%;
	font-weight: 300;
	font-size: 16px;	
	background: #dfe2e7/*#ededed #fdf5ed #fffaf5*/;		
}
h1{	font-size: 2.6em;}
h2{	font-size: 2.25em;}
h3 {font-size:1.5em;}
h4 {font-size:1.1em;}
.w3-dropdown-content{
	background: none;
	max-width: 80px;
	top:18px
}
.w3-dropdown-content img{width: 80%}
.tds .w3-dropdown-content{left: -2px}
.per .w3-dropdown-content{left: -25px}
.tin .w3-dropdown-content{left: 0}
.wog .w3-dropdown-content{left: 50px}
.noBordo .w3-dropdown-content{left: -18px}
#menu{
	display: none;
	z-index: 10;
	position: fixed;
	left:0;
	top: 0;
    min-width: 100%;	
	width: auto;
	box-shadow: 0px 1px 1px rgba(0,0,0, 0.4);/*box-shadow: 0px 2px 4px rgba(0,0,0, 0.6);*/
	border-top: 3px solid #172351;
	background: rgba(0,0,0,0.10);	
	transition:background .8s;	
	-webkit-transition-timing-function: cubic-bezier(.13,.23,.77,1);
	transition-timing-function: cubic-bezier(.13,.23,.77,1);
	}
#logo{
	width: 20%;
	float:left;
	padding: 1em 0 1em 4%;
	
	}
	#logo img{
		width: 100%;
		animation: 1s;
		}
.menuAlto{	
	margin-top: 10px;
	padding-right: 2%;	
  	text-align: right;
	box-sizing: border-box;
	font-weight: 400;
	}
.lingua{
	min-width: inherit;
	width: 100%;
	}
#BtMenu{
	position: absolute;
	background: transparent;
	right: 4%;
	bottom: .4em;
	box-sizing: border-box;		
	}
	.BtMenu{	
		color: #172351;
		padding:0 0.5em 0 0.2em;
		border:none;
		background-color: transparent;
		cursor: pointer;
		font-weight: 400;
		display: inline-block;
		}
	.bordo:first-letter{
		color: rgba(226,0,122,1.00);
	}
	.bordo:after {
			content: "";
			border-right: solid 1px rgba(226,0,122,1.00);  
			margin: 0 0 0 12px;
			}
	.BtMenu:hover{
		color: #3c9cbb/*#4e99b1#0199ca*/;
		}	
.BtMenuAlto{
	border:none;
	background: none;
	color: #172351;
	padding: 0 10px;
	cursor: pointer;
}
.primaB:first-letter{	
	color: #25235b;
	font-size: 1.1em;
	}
.BtMenuAlto:hover{
	color: #3c9cbb/*#4e99b1#0199ca*/;
}
#popupAvviso{
	display: flex;   
    justify-content: center;
    position: fixed;
    width: 100%;
    height: 100vh;
    align-items: center;
	background: #00000066;
	z-index: 999;
	opacity:0
	}
.popupAvviso{
	display: flex;
    align-items: center;
    background: url(img/notifica.png);
    color: white;
    background-repeat: no-repeat;
    background-size: 120px;
    height: 90px;
    font-size: large;
    border: 3px solid;
    outline: 7px solid #fe1800;
    font-weight: 600;
    background-color: #fe1800;
    background-position: left center;    
    padding: 0 20px 0 80px;
}	
.BtScInFt{
	display: none;
	color:#fdf5ed/*#fffaf5*/;	
	padding: 4px 15px;
	margin-right: 10px;
	border: 2px solid #fdf5ed/*#fffaf5*/;
	background:rgba(226,0,122,1.00);
	outline: rgba(226,0,122,1.00) solid 2px;
	font-weight: 500;
	}
.BtScInFt_B{	
	background: none;	
	outline: #343d85 solid 0px;
	}
#BtScontoInFt:hover{
	color:#fdf5ed/*#fffaf5*/;
	background: #343d85;
	outline: #343d85 solid 2px;	
	}
.BtLingua{color: #535191; font-size: .8em; border-top: 1px solid #535191; border-bottom: 1px solid #535191;}
.BtLingua:after {
	content: "▼";
	margin-left: 3px;	
	}
.colIniz{color:ghostwhite;}
/*.colIniz:after {
			content: "";
			border-right: solid 1px ghostwhite;;  
			margin: 0 0 0 8px;
			}*/
.colIniz_A{color:ghostwhite; border-color: ghostwhite;}
.colIniz_A:first-letter{	
	font-size: 1.1em;
	}
.noBordo:after {
			content: "";
			border-right: none;  
			margin: 0 0 0 12px;
			}

#contVideo{	
	height: 100vh;
	width: 100vw;
	background: url("video/backgroundVideo.jpg");
	background-size: 100%
	}
#contVideoBT{	
	display:flex;
	margin: 6vw auto 0 auto;
	width: 74%
	}
_:-ms-lang(x), #contVideo { height: auto; width: 100%;}
#video{		
   	object-fit: cover;
 	width: 100vw;
  	height: 100%;	
	object-position: center center;	
	}
#videoBT{  
 	width: 80%;
  	height: auto;		
	}
#code{
	color: #172351;
	border: 1px solid;
	border-left: none;
	width: calc(20% - 32px);
	margin-left: 32px
}
#code h2{
	margin: 0;
	font-weight: 300
}
_:-ms-lang(x), video { height: 100%; width: auto;}
#audioBt{
	position: absolute;
	right: 30px;
	bottom:20px;
	z-index: 1;
	width:2.25em;
	height:2.25em;
	}
	#audioBt:focus {
    outline: none;
}
.titoli{	
	width: 74%;
	margin: 3em auto 0 auto;/* color:gray;*/
}
.titProd{
	white-space: nowrap;    
    margin: 0;
    background: #3c9cbb/*#4e99b1#0199ca*/;
    color: #dfe2e7;
    padding: 0 24px 0 12px;
    margin-right: 1em;
}
.descrProd{
	display: flex;
	padding: 2em 16px;
}
.separatore{	
	border-top: 1.5px solid rgba(226,0,122,1.00);
	width: 10%;	
	margin: 1em auto 4em auto;			
	}
#benvenuti{	
	margin-left: 10%;  	
	padding: 6em 0;
	display: flex;
	flex-direction: column;
	width: 60%;
	}
.benvenuti{
	display: flex;
	/*align-items: center;*/	
	}
#benvenuti section{
	width: 30%;
	background: url("img/dal1976_bn.jpg");
	background-repeat: no-repeat;
	background-position: right;
	background-size: contain
}
#benvenuti article{
	font-size: 1.4em;
	line-height: 1.2;
	text-align: justify;
	margin-left: 3%;
	opacity: 0;
	width: 80%
}
#benvenuti div a{
	font-size: 12px;
	padding: 10px 16px;
	color: #172351;
	background: none;
    border: 1px solid #172351;
	cursor: pointer
}
#benvenuti div a:hover{color: #ededed;}
	
#brand,#ScontoInFt{
	display: none;
	width: 66%;
	margin: 5em auto;
	text-align: justify;
}
#brand h1,#ScontoInFt h1{
	font-weight: 300;
}
.marg_p{margin:.3em 0}
.noMargT{margin:0 0 .3em 0}
.noMargB{ margin-bottom: 0}
#contOnline{	
	display: none;
	position: absolute;
	/*top: 500px;*/
	right: -500px;/*era 500px*/
	z-index: 1;
	/*background: rgba(255,255,255,0.0);*/	
	font-size: 1em;
   /* width: 300px; /*era 300px*/
	transition: all 1s;
	line-height: 1;
	border:3px solid 
	}
	#online{
		position: relative;
		margin: .5em;	
		/*background:rgba(226,0,122,1.00); 
		color: rgba(255,255,255,1.00);
		padding: 0 .8em 1em .8em;*/	
		clear: both;
		}
_:-ms-lang(x), #online {font-size: .98em}
	#chiudiPopUp{
		display: none;
		position: absolute;
		top: -.8em;
    	right: -.8em;
   		width: 1.6em;   
    	line-height: 1.4;
		border-radius: 50%;
		font-size: 1.2em;
		text-align: center;
		color: ghostwhite;
		border:none;
		background: rgba(226,0,122,1.00);
		font-weight: 700;
		cursor: pointer;		
		}
		#online p{			
			padding: 0 .6em;	
    		margin: 0;
    		line-height: 1.3;
			}	
		#online section{text-align: center; padding-top: 8px}

		#BtOnline{
			width: 100%;
			
			font-size: 0.85em;			
			font-weight: 500;
			border: none;
			cursor: pointer;
			color: rgba(226,0,122,1.00);
			background: rgba(255,255,255,1.00);
			margin-top: 1em;
			padding: .8em 0;
			box-shadow: 2px 2px 4px rgba(0,0,0, 0.6);
			}
			#BtOnline:hover{
				box-shadow: none;
				}
.forte{
	display: block;		
	max-width: 100%;
	min-height: 45px;
	animation:2s blinker linear infinite;	
}
.sottoForte{
	display: block;	
	max-width: 100%;
	min-height: 35px;
	animation:2s blinker linear infinite;
	animation-delay: 1s
}
@keyframes blinker { 
0% { opacity: 1.0;}
50% { opacity: 0.33;}
100% { opacity: 1.0;}
}
	#datiCliente{
		display: none;
		margin: 1em;	
		background:rgba(226,0,122,1.00); 
		color: rgba(255,255,255,1.00);
		padding: 0.5em;
		clear: both;	
		}
	#datiCliente input{
		width: 100%;
		/*margin-bottom: 3px;*/
		margin-bottom: 8px;
		padding: 4px;
		box-sizing: border-box;
		}
	.BtInvia{		
		border: none;		
		color: rgba(226,0,122,1.00);
		background: rgba(255,255,255,1.00);		
		padding: .6em 0 !important;
		box-shadow: 2px 2px 4px rgba(0,0,0, 0.6);
		font-weight: 600;
		cursor: pointer;
		font-size: 1em;
		}
   .BtInvia:focus{
	   	outline: none;
  		box-shadow: none;	   
       }		
		#popAlert{
			display: none;
			text-align: center;
			background: white;
			color:red;
			padding: .5em;
			width: 90%;
			box-shadow: 2px 2px 4px rgba(0,0,0, 0.6);
			font-weight: 600;
			}
.alCentro{
		width: 20%;
		position: absolute;
		left: 50%;
		top:47%;
		-webkit-transform: translate(-50%, -50%);
  		-ms-transform: translate(-50%, -50%);
		-o-transition-property: translate(-50%, -50%);
		-o-transition-duration: .8s;
  		transform: translate(-50%, -50%);
		transition: width .8s;		
		-webkit-transition-timing-function: cubic-bezier(.13,.23,.77,1);
    	transition-timing-function: cubic-bezier(.13,.23,.77,1);
		}	
	.resized{
		width: 2px; opacity:0;
		}
#social{	
	display: flex;
    width: 22%;
    margin: 0 auto 1em;
    justify-content: space-between;
}
	.social{		
		width: 3.6em;
		opacity: .8
		}
		.social:hover{
			border: 1px solid #ededed;
			opacity: 1
			}
			
.rowNegozi{
	width: 100%;
	display: table;	
}
.imgNeg{
	padding: 0;
	border: none;
	vertical-align: middle;
	display: table-cell;
	position: relative;
	overflow: hidden;
}
.BtComeArr{
	position: absolute;
	padding: .5em .8em;
	margin: 2em 0;
    border: none;
    background: #172351;
	color:#ededed;
	cursor: pointer;	
}
#calcinelli .BtComeArr{	
	left: 0;
	bottom: 0;
}
#fano .BtComeArr{	
	right: 0;
	bottom: 0;
}
.BtComeArr:hover{
	color:#3c9cbb/*#4e99b1#0199ca*/;
}
.orari img{
	float: left;	
	width: 3.1em;
	height: auto;
}
.TxNegozi{
	display: table-cell;
	/*background: url('img/cornFotoNegozi_B.jpg')no-repeat center center;/*script carica cornFotoNegozi_Natale.jpg*/
	background-size: cover;
	padding: 4em 3em 0 5em;
	width: 50%;	
	background-color:#172351;/*#182d4f*/
	color:#ededed
	}
.calc{background-image: url("img/bordoSopra.png");}
.fano{background-image: url("img/bordoSotto.png");}
	.TxNegozi a{
		font-weight: 500;
		/*color: rgba(226,0,122,1.00);*/
			}
			.TxNegozi a:hover{
			font-weight: 600;
			}

.fotoNegozi {
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
    height: 100%;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    -webkit-transition: all .8s;
    -moz-transition: all .8s;
    -o-transition: all .8s;
    transition: all .8s;
}
.bg-calcinelli {
	background-image: url(img/NegCalc2.jpg);
}
.bg-fano {
	background-image: url("img/nuovoFano.jpg");
}	
#calcinelli:hover .fotoNegozi, #fano:hover .fotoNegozi {
    -ms-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
}
.w3-modal{
	z-index: 13;
	padding-top:130px;	
	background-color: rgba(0,0,0,0.6);
	}
	.map{
		width: 70%;
		}
	.altMap{
		height: 550px;
		}
		#panPerc{
			float:left;
			width:29%;		
			text-align:right;
			display:none;
			}
		.BtMappe{
			width: 100%;			
			border: none;
			cursor: pointer;
			color: rgba(226,0,122,1.00);
			background: rgba(255,255,255,1.00);
			margin-top: 1em;
			padding: .5em 0;
			box-shadow: 2px 2px 4px rgba(0,0,0, 0.6);
			font-weight: 600;
			}
			.BtMappe:hover{
				box-shadow: none;
				}
				#percorso{									
					overflow:auto;
					font-size: .8em;
					}
					#calcPercorso{
						float:left;
						width:29%;					
						background: rgba(163,176,183,1.00);
						padding: 3em 1em 0 1em;
						box-sizing: border-box;
						}					
						#partenza{
							width: 100%;
							margin-bottom: 16px;						
							padding: .4em .3em;						
							}
						.txMaps{							
							margin:3em 0 .5em .5em;
							}
						.txMaps p{							
							margin:0 .5em 0 1em;
							}
						#mappa{
							width:70%;						
							margin-bottom:16px;  
							float:right;
							border: 1px solid rgba(163,176,183,1.00);
							}
						.BgMapCalc{background: url("img/EstNegCalc.jpg")no-repeat center center;background-size: cover;}
						.BgMapFano{background: url("img/mapFano2.jpg")no-repeat center center;background-size: cover;}
.contProd{
	width: calc(77% - 16px);
	margin: auto; 
	}
.contProd .w3-col{
	width: 50%;
	padding: 0 16px;
	cursor: pointer;
	perspective:2000; -webkit-perspective:2000;
	}
.sfondoProd{
	display: flex;
	background: url('img/sfondoProd.png');
	flex-wrap: wrap;
	background-position: center;
	background-size: 100%;
}
.prod_tds, .prod_per{padding-bottom: 16px!important}	
.morph {
 -webkit-transition: all 0.5s ease;
       -moz-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
       -ms-transition: all 0.5s ease;
       transition: all 0.5s ease;
}
.morph:hover{	
       -webkit-transform: rotate(360deg);
       -moz-transform: rotate(360deg);
       -o-transform: rotate(360deg);
       -ms-transform: rotate(360deg);
       transform: rotate(360deg);
		}
	.blok{
		display:block;
		background:#3c9cbb/*#4e99b1#0199ca*/;
		}
	#prodotti{
		position: relative;
		padding-bottom:1em;			
		}	
	.prodHome{
		display: none;
		width: 76%;
		margin: 2em auto 0;
		}
	.prodHome .w3-cell{
		width: 33.33%; padding: 0 16px;	
		}
		.TxProdHome{
			width: 100%;			
			box-sizing: border-box;
			text-align: justify;
			border: 1px solid #3c9cbb/*#4e99b1#0199ca*/;
    		border-left: none;
			padding: 6px 1em 6px 0
			}
		.prodHome img{
			border:1px solid gray;
			width: 100%;
				}
.ascoltaTx {
	border: none;
	width: 1.4em;
	cursor: pointer;
	background: none;
	padding: 0;
}
.ascoltaTx img{
	width: 100%;
	border:none
}
	#contQuattro{
	width: calc(100% - 32px);
	margin:0 auto 3em auto;
	} 
	#contCinque{
		padding: 0 16px;	
		}	
	#quattro{
		width: 69%; float: left;
		}	
	.unQuarto{
		width: 50%;
		float: left;
		box-sizing: border-box;
		padding-right:2vw;
		}
	#lungo{
		width: 31%;
		float: left;
		position: relative;
		margin-bottom: 2em;
		}
		#lungo h3{
			position: absolute;
			bottom: 0;
			width: 100%;
			}	
	.blok img{		
		transition-delay:.6s;
		transition: all .6s;
		}
		.blok:hover .BtProd{			
			background: #3c9cbb/*#4e99b1#0199ca*/;
			/*font-size: 1.35em;
			padding-top: 0*/
			
			} 
		.blok:hover img{			
			transform: scale(.8);
			filter:drop-shadow(0 0 0.5em #2d2173);			
			}
		.BtProd{
			display: block;
			width: 100%;
			text-align: left;
			font-size: 1.1em;
			color:#ededed;
			background: #172351;
			padding: .5em 1em;
			font-weight: 500;
			margin: 0;
			transition: all .6s ease;
			}
		#Bgprod{
			position: absolute;
			bottom:-50px;
			left: 53%;
			z-index: -1;
			width: 36%;
			}
	#imgTdS{		
		background: url("img/goTendeEst.gif")no-repeat center center;
		background-size: cover;		
		}		
	#imgPer{		
		background: url("img/goPergole.gif")no-repeat center center;
		background-size: cover;		
		}		
	#imgTin{		
		background: url("img/goTendeInt.gif")no-repeat center center;
		background-size: cover;		
		}
	#imgWog{		
		background: url("img/goPaperOgg2.gif")no-repeat center center;
		background-size: cover;		
		}	
	.imgProd img{
		width: 100%;
		opacity:1;		
		border: 1px solid gray;	
		border-bottom:none;
		}	
.Prod img{	
		transition: all .6s ease;
		}
		.Prod:hover img{
			transform: rotateY(180deg);
			opacity: 0;
			}
		.Prod:hover h4{
			color: #2d2173;
			background: #3c9cbb/*#4e99b1#0199ca*/;	
			border: none;
			}	
#descrProd{
	opacity: 0;
	width: 74%;
	margin:2em auto 0 auto;	
	}
.conSfondo, .senzaSfondo{padding: 0 0 8px 24px;margin-left: 2%;}
	.BgDesign{
		width: 42%;
		float: left;		
		background: url('img/sfondoDescr.png') no-repeat left bottom;
		background-size: contain;
		
		}
		.posDet{
			margin: 0 3% 0 12%;
			}
	.titDescr{
		font-size: 2em;		
		font-weight: 400;
		}
	.txDescr{
		display: inline-block;
		margin: -4px 0 0 -4px;
		font-size: 1.2em
		}	
.w3-animate-top {    
    animation: animatetop 0.8s;
}
#news{
	background: rgb(23, 35, 81);
    margin-top: 6em;
    padding: 6em 0;
}
.contNews{
	width: 76%;
	display: flex;
	margin: auto; 		
	} 
	.titNew{
		padding: 0; margin: 0;
		}
	.newCollection{
		font-size: 1.2vw;
		}
	.TxNewCollection{
		padding:.8em;			
		}	
	.news{		
 		width: 33%; 
		position: relative;
		-webkit-transition: all .6s; /* Safari */
    	transition: all .6s;
		}
.newsColCentr{ 
	margin:0 32px;
}
.titoloNews{ 
	margin:0 32px 0 0;
	color: #ededed;
	padding-left: 10px;
    border: 1px solid;
	border-right: none
}
	.news-image {
		 display: block;
		 height: auto;
		 margin: 0 auto;
		 max-width: 100%;
		 width: 100%;
		 border-bottom: 3px solid #fdf5ed;
		flex-shrink: 0;
		}
	.dataNew{
	 	display: inline-block;
		position: absolute;
		left:0;
		top: -24px;
		padding: 2px 8px;
		/*background:#fdf5ed;
		border-radius: 0 0 5px 5px;    		
    	box-shadow: 0 4px 4px -2px rgba(0,0,0, 0.6);*/
		font-size: .9em;
		color: #ededed;	
}
.ascolta{
	display: inline-block;
		position: absolute;
		right:5px;
		bottom: 10px;
		padding: 2px 8px;
		background:#fdf5ed;
		border-radius: 5px;    	
		font-size: .9em;
		color: #a22032;	
	font-weight: 500;
	border: none;
	cursor: pointer;
}	
	.news-content {
		display: flex;
		display: -webkit-flex;
		flex-direction: column;
		-webkit-flex-direction: column;
		padding: 1em 1.5em 2.5em 1.5em;
		color: white;
		}
		.blue{
			background: #184696;
			}	
.dentroLaNew{
	margin-top:1em;
	max-width: 100%;
	height: auto;
}
.BtNews{
	display: none;
	margin-top: auto;
	text-align: right;
	position: absolute;
	bottom: 1em;
	right: 2em;
	font-style: oblique;
	font-weight: 500;
	}	
.grassCor{
	font-weight: 500; font-style: oblique;
}
.xChiudere{
	display: none;
	width: 100%;	
	text-align: right;
	padding: 2px 4px 2px 0;
	border-bottom: 3px solid #fdf5ed;
    background: #ffffff25;
	}
	.chiudiFinNew{	
		background: none;
		color: #25235b;
		border:1px solid #25235b;
		font-weight: 600;
		line-height: 1;
		cursor: pointer;
		}
	.allargaNews{
		width: 66%; background: #25235b;margin-right: 32px;
		}
	.stringiNews{
		opacity:.5;
		filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><fecolormatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'></fecolormatrix></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
    	filter: gray; /* IE6-9 */
    	-webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
		}
.newsLet{ 
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	width: 55%;
	}
	.newsLet p{		
		margin: 3px 0;
		font-weight: 400;
		}
	.newsLet input{ 
		border:none;
		border-bottom: 1px solid #172351;
		width: calc(500px - 2.5em);
		height: 2.5em;
		background: none;
		}
#iscriviti{
	 width: calc(500px - 2.5em);
	 color:#172351;
	 margin-top: 0		 	
}
	.newsLet input:focus{ 
		outline:none;
		border-bottom: 1px dashed #172351;		
		}
#apriIscr{vertical-align: bottom;background:#172351;}
#apriIscr:hover{background:#3c9cbb/*#4e99b1#0199ca*/;}
.preFooter{
	display: flex;
	width: 76%;
	margin: 4em auto 5em auto;
	justify-content: /*space-between*/space-around;	
}
.quadratino{
	font-size: 1.7em;
	color: #3c9cbb/*#4e99b1#0199ca*/;	
}
.suGif{
	position: absolute;
	left: 84px;
    bottom: 20px;
    width: 130px;
	border: 1px solid white;
	background: none;
	padding: 4px;
	color: #ededed;
	cursor: pointer;
}
#pagoDil{
	position: relative;
    margin-right: 2em;
}
#pagoDilBT:hover{background: rgba(255,255,255,0.50)}
#ecoBT{
	background: rgba(255,255,255,0.75);
	color: #6b9434;
	border: 1px solid #6b9434;
}
#ecoBT:hover{background: rgba(255,255,255,1)}
#ecoTx{
	display: none;
	border: 3px solid #6b9434;
	width: 297px;
	height: 340px;
	background: #fffdea
}
.bollino{
	color:#172351;
	font-size: 1.3em;
	margin: 0 5px;
	cursor: pointer;
}
#chiudiEco{
	background: #6b9434;
	color: #fffdea;
	font-weight: 600;
	cursor: pointer;
	border: none;
	border-left: 3px solid #6b9434;
	border-bottom: 3px solid #6b9434;
}
.Gif{
	position: absolute;
    left: 10px;
    top: 10px;
    display: none;
}
footer{			
	background: #172351;
	color:#ededed;
	padding-bottom: .5em;
	padding-top: 1em;
}
.colFooter{
	float: left;
	padding: 1.5em 4em 2em 8em;
	box-sizing: border-box;
}
.colFootCon{
	width: 30%; position: relative; height: 14.7em;
}
	.logoFooter{
		margin-bottom: .75em;
		width: 3em;
		height: 3em;
		}
#menuSotto{
	font-size:.8em;
	text-align: center;
	border-top: 1px solid #ededed;	
	padding: 1.2em 0;		
	}
#avvCookie{
	display: none;
	background: #172351;
	color:#ededed;
	text-align:right;		
	padding: 0 4em;	
	position: fixed;
    z-index: 99;
    width:100%;
	bottom:0; 			 
}
#avvCookie p{
	display: inline-block;
	float:left;	
}
#avvCookie input{
	background:rgba(245, 245, 245, 1);
	border:none;
	color:rgba(51, 122, 183, .8);
	margin-top:.8em;
	padding:.3em .6em;
	font-size:1em;
	font-weight:600;
	cursor:pointer;
}
#avvCookie input:hover{
	background:#CCCCCC;
}
#infoSpeakToText{	
	width: 430px;
	box-sizing: border-box;
	background: url("img/ia.jpg");
	background-size:cover;
	border: 2px solid;
	color:#ededed;
	position: fixed;
    z-index: 99;
	bottom:1em;
	left: -600px;	
}
#BarraSpeakToText{
	margin: 0;
	text-align: right;
	padding: 2px 2px 3px 0;
    font-size: .8em;
    border-bottom: 2px solid;	
}
#infoSpeakToText article{
	padding: .5em 1em 1em 1em;
	text-align: justify	
}
#chiudiInfoSpeak{
	background: none;
	border:none;
	color:#ededed;
	font-weight: 600;
	cursor: pointer
}
#TestSpeak{
	padding: 0 2em;
	display: none
}
#TestSpeak button{
	cursor: pointer;
	background: none;
	color:#ededed;
	border: 1px solid;
	margin-left: 10px
}
#tornasu{
	position: fixed;
	bottom: 0;
	right: 10px;
	display:none;	
	cursor:pointer;
	background:#3c9cbb/*#4e99b1#0199ca*/;	
}
#tornasu img{
	 width:2.5em;
	height:3.1em
}
.w3-dropdown-hover:first-child, .w3-dropdown-click:hover{
     background: none;	
}
.DiNon{	
	display:none;
	}
.DiShow{	
	display:block;
	}
.w3-animate-left {    
    animation: animateleft 1.2s;
	
}
.w3-animate-right {    
    animation: animateright 1.2s;
	
}
.w3-animate-bottom {    
    animation: animatebottom 1.2s;
}
.BtAnim {display: inline-block; position: relative; border: 1px solid #5c6dbb; height: 2em; width: 6.25em;cursor: pointer;}
.BtAnim .br-left{display: block; width: 0px; height: 100%; transition: 0.6s; background:#3c9cbb/*#4e99b1#0199ca*/;	} 
.BtAnim a{
	position: absolute;
	white-space: nowrap;
	left: 50%;
	top:50%;
	-webkit-transform: translate(-50%, -50%);
  	-ms-transform: translate(-50%, -50%);
  	transform: translate(-50%, -50%);
	}
.BtAnim:hover .br-left{ width:  100% ;}
.BtAnimC{width: 7.5em; margin-top: .6em;}
.BtAnimS{width: 6.5em;}
.powered{
	width: 6em;
	height: auto;
	transition: .3s;
}
.powered:hover{
	transform: scale(1.1);
}
#FB_s{display: none}
#ecoB img{	
	width:620px;
	height:340px
	}
@media only screen and (max-width: 1280px) and (orientation:landscape){
#FB_l{display: none}
#FB_s{display: block}
.newsLet input{width: calc(340px - 2.5em)}
#iscriviti{ width: calc(340px - 2.5em)}	
body{font-size:.85em}	
#logo { width: 25%;}
.tds .w3-dropdown-content{left: -7px}
.per .w3-dropdown-content{left: -30px}
.tin .w3-dropdown-content{left: -10px}
.wog .w3-dropdown-content{left: 35px}
.noBordo .w3-dropdown-content{left: -25px}	
	#contOnline{	
	/*width: 250px; /* era 250px*/
	}	
#online{
	padding: .5em;
	}
#benvenuti{width: 70%}	
#brand,#ScontoInFt{	width: 80%;}	
.TxNegozi{	
	padding: 1.5em 2em 0 4.5em;
	}	
.contProd{
	width: calc(88% - 8px);	
	}
.contProd .w3-col{
	width: 50%; padding: 0 8px; 
	}
.prod_tds, .prod_per{padding-bottom: 8px!important}	
.prodHome{		
		width: 88%;		
	}
.prodHome .w3-cell{
	width: 33.33%; padding: 0 8px;	
	}
#contVideoBT{width: 86%}
#videoBT{width: 76%}	
#code{
		width: calc(25% - 16px);
		margin-left: 16px
	}	
.titoli{
	width: 86%;
	margin: 2.5em auto .5em auto;
	}	
#descrProd{	width: 84%;	}
.descrProd{	padding: 2em 8px;}
#contQuattro { width: calc(100% - 16px)}
	.posDet{
		margin: 0 3% 0 8%;
		}
#Bgprod{	
	bottom:-30px;
	left: 55%;
	width: 39%;
	}
.contNews{
	width: 86%;	
	}	
.news {    
    width: 32.2%;
	}	
.newsColCentr{ 
	margin:0 16px;
}
.titoloNews{ 
	margin:0 16px 0 0;
}	
.allargaNews{
		width: 66%; background: #25235b;margin-right: 16px;
		}
.TxNew{
	line-height: 1.2;
	}
.spazioNews{	
	width: 3.6%;		
	}
	.w3-modal{
		padding-top:50px; 
	}
		.map{
			width: 90%;
			}
		.altMap{
			height: 500px;
		}
#calcPercorso h4{font-size:130%;}
#percorso{font-size: .94em;}
.preFooter{width: 86%}	
.colFooter {padding: 1.5em 4em 2em 5em;}
}	
@media only screen and (min-width: 1281px) and (max-width: 1440px) and (orientation:landscape){
#logo { width: 22%;}	
#benvenuti {
        width: 70%;
        margin-left: 8%;
    }
#benvenuti article{ font-size: 1.3em}	
.TxNegozi{	
	padding: 2em 3em 0 5em;	
	}	
.contProd{
	width: 84%;	
	}
.prodHome{		
	width: 84%;		
	}	
#contVideoBT{width: 82%}
	#videoBT{width: 75%}
#code{
	width: calc(25% - 16px);
	margin-left: 16px
}
.titoli{
	width: 82%;
	margin: 2.5em auto .5em auto;
	}		
#descrProd{	
	width: 84%;	
	}	
.posDet{
	margin: 0 3% 0 8%;
	}	
#Bgprod{	
	bottom:-30px;
	left: 53%;
	width: 39%;
	}	
.contNews{
	width: 82%;	
	}
.TxNew{
	line-height: 1.3;
	font-size: .85em;
	}	
.w3-modal{padding-top:50px;}
.map{width: 90%;}
.altMap{height: 500px;}	
.preFooter{width: 86%}
}
@media only screen and (min-width: 1441px) and (max-width: 1600px) and (orientation:landscape){
	#benvenuti {
        width: 66%;
        margin-left: 8%;
    }
#code{
		width: calc(25% - 16px);
		margin-left: 16px
	}	
#code h2 {
       font-size: 2em
    }	
#benvenuti article{ font-size: 1.4em}
	#lineaProd{
	margin: 2em auto 3em auto;	
	}
}
@media only screen and (max-width: 1279px)and (orientation:landscape){	
_:-ms-lang(x), video { height: auto; min-width: 1280px;margin-left: -128px;	}	
#audioBt{	
	right: 15px;
	bottom: 20px;
	}
.TxNegozi{font-size: .9em}	
#descrProd{
	margin: 1em auto 0 auto;
	}
.w3-modal{
		padding-top:150px; 
	}
	.titNew	{
		font-size: 1.3em;
	}
.TxNew{line-height: 1.2; font-size: .85em}
.TxNewCollection{font-size: .8em; padding: 1em;}
.newCollection{	font-size: 1.5vw;}
#avvCookie{	padding: 0 2em; font-size: .9em	}
}
@media only screen and (max-width: 1150px){
	#benvenuti {
		width: 84%;
		margin-left: 8%;
	}
	#descrProd {width: 90%;}
	.preFooter{width: 98%}
	#pagoDil{margin-right: 1em;}
}
@media only screen and (min-width: 1601px)and (max-width: 1680px) and (orientation:landscape){
	#benvenuti{width: 65%}
	
}
@media only screen and (min-width: 1681px)and (max-width: 1768px) and (orientation:landscape){
	#benvenuti{width: 60%}	
}
@media only screen and (width: 1280px)and (min-height: 800px){	

}
@media only screen and (width: 1280px) and (max-height: 720px){	

}
@media only screen and (max-width: 1366px)and (orientation:landscape){
#descrProd{
	margin: 1.5em auto 0 auto;
	}
#FB_l{display: none}
#FB_s{display: block}
.newsLet{width: 35%;}		
.newsLet input{width: calc(340px - 2.5em)}	
 #iscriviti{width: calc(340px - 2.5em)}
}
@media only screen and (min-width: 1536px) and (orientation:landscape){
	.TxNew{line-height: 1.3; font-size: .9em}
}
@media only screen and (min-width: 1768px) and (orientation:landscape){
	.TxNew{line-height: 1.3; font-size: 1em}
	.preFooter{width: 76%}
}
@media only screen and (min-width: 1920px) and (orientation:landscape){		
#Bgprod {    
    bottom: -35px;
	left: 53%;
    width: 35%;
	}
}
@media only screen and (min-width: 2560px){	
body{font-size: 1.3em}	
#logo {width: 22%}
#benvenuti{width: 53%}
#benvenuti section {width: 24%;}
#Bgprod {   
    bottom: -70px;
    left: 53%;
    width: 37%;
	}
.dataNew{top: -36px}
#ecoB img{	
	width:800px;
	height:auto
	}
#infoSpeakToText { width: 560px}	
}