@charset "utf-8";
html{
	width: 100%;
	height: 100%;
	height: auto;
	font-family: 'Roboto', sans-serif;
	color:#25235b;
}
::-webkit-scrollbar {
  width: 10px;
}
/* Track */
::-webkit-scrollbar-track {
  background: rgba(20,18,78,0.20); 
} 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #fdf5ed; 
}
/* 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;
}
button:focus {
  outline: none;
  box-shadow: none;
}
.curPoint{
	cursor: pointer;
}
.curPoint:hover{
	font-weight: 500;
}
.stile_title {
position: relative;
}
.stile_title[data]:hover:after {
font-size: 15px;
content: attr(data);
padding: 4px 8px;
position: absolute;
left: 0;
top: 0;
white-space: nowrap;
z-index: 20;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
border: 1px solid white;
background: #172351;
color:white;
}
body{	
	margin: 0 auto;
	padding: 0;
	font-family: Roboto, Arial, sans-serif;
	height: 100%;
	font-weight: 300;
	font-size: 16px;	
	background: #dfe2e7/*#fffaf5*/;
	display: none;
}
.w3-modal {
    z-index: 13;
}
input, textarea{
	font-family: Roboto, Arial, sans-serif;
	font-size: 1em;
	padding: .4em;
	border: 1px solid #172351;
}
#logo{
	width: 20%;
	float:left;
	padding: .9em 0 .7em 4%;
	}
	#logo img{
		width: 100%;	
		}
#menu{
	z-index: 10;
	position: fixed;	
	left:0;
	top: 0;
    min-width: 100%;	
	width: auto;
	background: #dfe2e7/*#fffaf5*/;
	box-shadow: 0px 2px 4px rgba(0,0,0, 0.6);
	border-top: 3px solid rgb(1 153 202);
	}	
#BtMenu{
	position: absolute;	
	right: 4%;
	bottom: 3px;
	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;
		}
	/*.BtMenu:first-letter{
		color: rgba(226,0,122,1.00);
	}
	.BtMenu:after {
			content: "";
			border-right: solid 1px rgba(226,0,122,1.00);  
			margin: 0 0 0 12px;
			}*/
	.BtMenu:hover{
		color: rgb(1 153 202);	
		}
	.noBordo:after {
			content: "";
			border-right: none;  
			margin: 0 0 0 12px;
			}
	.frecciaTorna:before{
		content: "<";			
		margin: 0 6px 0 0;
		color: rgb(1 153 202);
		font-weight: 600;
		font-size: 1.2em;
		}
header{
	position: relative;	
}
.titolo{
	position: absolute;
	width: 100%;
	bottom: 1em;
	text-align: center;
	color:ghostwhite;		
	font-size: 3em;
    font-weight: 300;
    letter-spacing: .3em;
	background: rgba(255,255,255,0.3);
    padding: .5em 0;
	}
.descrProd{
	width: 76%;
	margin:100vh auto 0 auto;
	font-size:1.2em;
	padding: 3em 0;
	text-align: justify;
	}
.ascoltaTx{
	border:none!important;
	width: 1.2em!important;
	cursor: pointer
}
.row {
 	width: 100%;
	margin: auto;
}
.r_quattro {
 width: 100%;	
}
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Six columns side by side */
.column {
  float: left;
  width: 31.33%;
	margin:3em 0 0 0;
	position: relative;
}
.c_quattro{
	width: 23.5%;
}
.lente{
	position: absolute;
	top: 0;
	left: 0;
	opacity:0;
	transition: all .6s ease;
	transform: scale(.1);
	
}
.column:hover .lente{	
	opacity:1;	
	transform: scale(1);
}
.colC {  
	margin: 3em 3% 0 3%; 
}
.colV{margin: 1.5em 0}
.colC_S {  
	margin: 3em 1% 0 2%; 
}
.colC_D {  
	margin: 3em 2% 0 1%; 
}
.codeTx{
	width: 40%; padding-right: 3%;
}
#preventivo{
	width: 76%;
	position: relative;
	margin:auto;
	padding: 2em;
	background: #d7e7ef;
	border-top:10px solid #25235b;
	border-bottom:10px solid #25235b;
}
#preventivo input[type="text"] {
    padding: 6px 3px;
	box-sizing: border-box;
}
#alertPrev{
	display: none;
	background: ghostwhite;
	border:10px solid red;
	color:red;
	width: 30%;
	position: fixed;
	top:20%;
	left:35%;	
	font-weight: 500;
	padding: 1em;
	z-index: 1;
	box-sizing: border-box;
}
#preventivo h1{
	color:#25235b;
	font-family: Roboto, Arial, sans-serif;
	margin-top: 0;
	font-size: 2.2em;
	font-weight: 300;
}
#preventivo h2{
	color:gray;
	font-family: Roboto, Arial, sans-serif;
	padding: 0;
	margin: .5em 0 .5em 2em;
	font-weight: 300;
	font-size: 1.9em;
}
#preventivo h3{
	color:#25235b;
	font-family: Roboto, Arial, sans-serif;
	padding: 0;
	margin: .5em 0 .5em 0;
	font-weight: 300;
	font-size: 1.4em;
}
#preventivo h5{
	color:#25235b;
	font-family: Roboto, Arial, sans-serif;
	padding: 0;
	margin: .5em 0;
	font-weight: 400;
	font-size: 1.2em;
}
#sceltaEcoSiNo a{
	font-weight: 500;
	padding: 0 .5em;
	margin: 0 .5em;
}
.w3-quarter {
    width: 24.99999%;
}
.nascEco{
	display: none;
}
.ecobonus{
	padding: .5em 1em 0 0;
	text-align: right;
}
.nota_prev{
	font-size: .8em;
	color:#25235b;
	margin-top: 0;
}
.area{
	/*width: 89%;*/
	width: 100%;
	font-size: 1em;
}
#istruzCarFile{
	line-height: 1.4;
	margin-bottom: 5px;
}
.categoria, .periodo{
	width: 22%;
	text-align: center;
	float: left;	
	transform: scale(2);
}
.aSx{
	width: 48%;
	float: left;
}
.aDx{
	width: 52%;
	float: left;
	border-left: 1px solid #25235b;
	padding-left: 4%;
	box-sizing: border-box;
}
.inp72{width: 76%;}
.inp10{width: 13%; margin-left: 3%}
.inp50S{width: 48.5%; margin-right: 1%}
.inp50D{width: 48.5%; margin-left: 1%}
.marSx{margin-left: 6%;}
#BtInfoPrev{
	background: none;
	border: none;
	font-style: oblique;
	color:#25235b;
	font-size:1em;	
    padding: 0 3px;
}
#infoPr{position: relative; display: block; width: 100%;}
#accetto{width: 1.6em; height: 1.6em;position: absolute; top:.8em;}
@-moz-document url-prefix('') {
   #accetto {
       top:.9em;	   
    }
}
#infoPr p{display: inline-block; padding-left: 2.2em; box-sizing: border-box;}
.BtInviaPrev{
	background: #25235b;
	border: none;
	color: ghostwhite;
	width: 33%;
	padding: .6em;
	font-size: 1.2em;
	letter-spacing: .4em;
}
.BtCanc{
	background:#ededed;
	border: none;
	color: #172351;	
	padding: .6em 0;
	font-size: 1.2em;	
	margin-left: 1em;
	width: 15%;
}
#confPrev{
	display: none;
}
footer{
	margin-top: 60px;		
	background: #172351;
	color:#ededed;
	padding-bottom: .5em;
	padding-top: 1em;
}
footer a{color:#ededed}
.colFooter{
	float: left;
	padding: 1.5em 4em 3em 8em;
	box-sizing: border-box;
}
.colFootCon{
	width: 30%; position: relative; height: 14.7em;
}
	#menuSotto{
		font-size:.8em;
		text-align: center;
		border-top: 1px solid #ededed;
		padding: .8em 0;		
	}
#menuSotto .BtMenu{ color:#ededed}
.BtAnim {display: inline-block; position: relative; border: 1px solid #5c6dbb; height: 2em; width: 6.25em; }
.BtAnim .br-left{display: block; width: 0px; height: 100%; transition: 0.6s; background:#5c6dbb;} 
.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;}
.powered{
	width: 6em;
	height: auto;
	transition: .3s;
}
.powered:hover{
	transform: scale(1.1);
}
/*-----INIZIO SLIDE-----*/
.contSlide{
  display: none; /* Hidden by default */
  position: fixed; 
  z-index: 99; 
  padding-top: 2em; 
  left: 0;
  top: 0;
  width: 100%; 
  height: 100%; 
  overflow: hidden; 
  background-color: rgb(0,0,0); 
  background-color: rgba(0,0,0,0.9); 
}

/* Modal Content (image) */
.modal-content {
	position: relative;
  	margin: 5% auto;
  	display: block;
  	width: 70%;  
}
.img16_10{
	margin-top: 3%;
}
/* Hide the images by default */
.mySlides {
  display: none;
}

/* Add a pointer when hovering over the thumbnail images */
.cursor {
  cursor: pointer;
}

/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 43%;
  width:auto;
  padding: 16px; 
  color: white;
  font-weight: bold;
  font-size: 20px;
  border-radius: 0 3px 3px 0;
	background-color: rgba(0, 0, 0, 0.5);
  user-select: none;
  -webkit-user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
  background-color: rgba(0, 0, 0, 1);
}
.noActive{
	pointer-events: none;
	color: rgba(0, 0, 0, 0);
}
/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 13px; 
  position: absolute;
  top: -20px;
}
.chiudiFin {
	background: none;
	border:1px solid #f2f2f2;
  	color: #f2f2f2;
	font-size: 20px;
  	padding: 0 7px 3px 7px;
    line-height: 1;
    position: absolute;
    top: -33px;
	right: 0;	
	}
/*-----FINE SLIDE-----*/
@media only screen and (max-width: 1600px) and (orientation:landscape){
.codeTx{
	width: 40%; padding-right: 3%;line-height: 1.3;
	}
}
@media only screen and (max-width: 1366px) and (orientation:landscape){
.codeTx{
	font-size: .9em;
	}
}
 
@media only screen and (max-width: 1280px) and (orientation:landscape){
body{
	font-size: 0.85em;	
	}
#logo {
	width: 25%;
	}	
header{
	padding-top: 1em;	
	}
.codeTx{
	font-size: 1em;line-height: 1.5;
	}	
#preventivo h2 {
    font-size: 20px;
}	
#preventivo{
	width: 86%;	
	}
.nota_prev{
	font-size: .9em;	
}	
.descrProd {
    width: 86%;	
	}
.categoria, .periodo{	
	transform: scale(1.3);
	font-size: 1.2em;
	}
.colFooter {    
    padding: 1.5em 4em 3em 5em;
	}
}	
@media only screen and (min-width: 1281px) and (max-width: 1535px) and (orientation:landscape){
#logo {
	width: 22%;
	}		
#preventivo h2{
		font-size: 24px;
	}	
.categoria, .periodo{	
	transform: scale(1.6);
	}	
}
@media only screen and (max-width: 1024px) and (orientation:landscape){	
	header{
	padding-top: 3em;	
	}
.modal-content {
	width: 80%;
  	margin: 9% auto;    
	}
.img16_10{
	margin-top: 7%;
	}
.w3-display-bottommiddle{
	max-width: 70%;	
	}	
}
@media only screen and (min-width: 1025px) and (max-width: 1366px){
.modal-content {
  	width: 65%; 
	margin: 6% auto;
	}
.img16_10{
	margin-top: 4%;
	}
}
@media only screen and  (max-height: 720px) and (width: 1280px) {
.modal-content {
  width: 65%;    
	}
}
@media only screen and (min-width: 2560px)and (orientation:landscape){	
body{font-size:1.5em}	
#logo { width: 22%;}
[type=radio] {   
    transform: scale(1.3);
    transform-origin: .3em .7em;;   
	}
}