/*! HTML5 Boilerplate v5.0 | MIT License | http://h5bp.com/ */

html {
    color: #222;
    line-height: 1.4;
	height:100%;
	font-size: 1em;
}
@font-face {
    font-family: Roboto;
    src: url(Roboto-Regular.ttf);
}
@font-face {
    font-family: 'Roboto Bold';
    src: url(Roboto-bold.ttf);
    font-weight: bold;
}

body{
	font-family: 'Roboto', sans-serif !important;
	height:100%;
	font-size: 1.3em !important;
}
::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

a{
	cursor:pointer;
}
label{
	cursor: pointer; 
}
label span {
  pointer-events: none;
}
#informativa{
	z-index:1500;
}
.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}
.nopadding{
	padding:0px !important;
}
.nopaddingSide{
	padding:0px 10px !important;
}
.nomargin{
	margin:0px !important;
}
.pull-left{
   float:left;
}
.pull-right{
   float:right;
}
.hamburger-container{
	display:flex;
}
.hamburger{
	transition:all .3s ease-out;;
}
.hamburger.is-active{
	transform:translateY(4px);
}

.hamburger:focus,.hamburger:active {
   outline: none !important;
}
.relative{
	position:relative;
}
.margin15topbottom{
	margin:15px 0px;
}
.credit{
	position:fixed;
	bottom:10px;
	font-size:0.7em;
}
/*MESSAGGIO*/
.chiudi{
	text-align:center;
	color:white;
	position: relative;
	margin-top:20px;
	font-size: 1.3em;
	cursor:pointer;  	
}
/* COLORi */
.gialla{color:#f6bc27;}
.blu{color:#154575;}
.verde{color:#11a511;}
.arancione{color:#f37d22;}
.viola{color:#a44699;}
.error{color:red !important;}
.errorline{border:1px solid red !important;}
.grigio{color:#666 !important;}

#metromappa{
	height:100%;
}
.textcenter{
	text-align:center;
}
	#referente h6{
		text-transform: uppercase;
	}
#general-loader{
	position:fixed;
	z-index:9999999999;
	background-color:#154575;
	opacity:1;
	width:100%;
	height:100%;
}
#general-loader img{
    left: 50%;
    position: absolute;
    margin-left: -100px;
    top: 35%;
}
/*TRANSIZIONI*/
.slide-fade-enter-active {
	transform: translateY(-100px);
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;	
}
.slide-fade-leave-active {
	transform: translateY(100px);
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;	
}
#welcoma,#welcoma2,#message,#grazie{
    position: fixed;
    top: 70px;
    left: 50%;
    margin-left: -35%;
    padding: 20px;
    z-index: 1000;
    background-color: rgba(21, 68, 117, 0.8);
    width: 80%;
    color: white;
    text-align: center;
    font-size: 1.2em;
    height: 450px;
}
#message{
	z-index:1000;
}
#welcoma{
	top:50%;
	margin-top: -225px;
	z-index:900;
}

#welcoma2 {
	display: flex;
	align-content: center;
	align-items: center;
	justify-content: center;

}

#welcoma2  .d-flex{
	justify-content: space-between;
	display: flex;
}
#welcoma2,#message,#grazie{
    width: 100%;
    height: 100%;
    right: 0px;
    top: 0px;
    background-color: rgba(21, 68, 117, 1);
    margin-left: 0;
    left: 0;
    overflow-y: scroll;
}
#welcoma2{
	z-index: 99999999;
}
#grazie{
	z-index:1300;
}

.slide-welc-enter-active {
  transition: all .3s ease;
}
.slide-welc-leave-active {
  transition: all .8s cubic-bezier(1.0, 0.5, 0.8, 1.0);
}
.slide-welc-enter, .slide-welc-leave-to
/* .slide-fade-leave-active below version 2.1.8 */ {
  transform: translateY(10px);
  opacity: 0;
}

/*ESTREMI*/
.estremoblu {
    position: absolute;
    width: 64px;
    height: 72px;
    top: 246px;
    left: 59px;
    z-index: 350;
    cursor: pointer;
}
.estremoblu2 {
    position: absolute;
    width: 48px;
    height: 68px;
    top: 379px;
    left: 65px;
    z-index: 350;
    cursor: pointer;   
}
.estremoverde {
    position: absolute;
    width: 45px;
    height: 64px;
    left: 136px;
    top: 58px;
    z-index: 350;
    cursor: pointer;
}
.estremoverde2 {
    position: absolute;
    width: 46px;
    height: 100px;
    top: 165px;
    left: 617px;
    z-index: 350;
    cursor: pointer;    
}
.estremogiallo {
    position: absolute;
    width: 50px;
    height: 70px;
    left: 323px;
    z-index: 350;
    cursor: pointer;
}
.estremogiallo2 {
    position: absolute;
    width: 62px;
    height: 55px;
    z-index: 350;
    top: 628px;
    left: 375px;
    cursor: pointer;
}
.estremoarancione {
    position: absolute;
    width: 72px;
    height: 66px;
    z-index: 350;
    left: 66px;
    top: 67px;
    cursor: pointer;    
}
.estremoarancione2 {
    position: absolute;
    width: 85px;
    height: 39px;
    z-index: 350;
    top: 455px;
    left: 600px;
    cursor: pointer;    
}
.estremoviola {
    position: absolute;
    width: 64px;
    height: 52px;
    left: 50px;
    z-index: 350;
    top: 135px;
    cursor: pointer;    
}
.estremoviola2 {
    position: absolute;
    width: 81px;
    height: 69px;
    left: 95px;
    top: 550px;
    z-index: 350;
    cursor: pointer;    
}

.st1.line-custom-color--red{
	fill: red !important;
}

.st1.line-custom-color--light-blue{
	fill:  rgb(0, 153, 255) !important;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

   /* HEADER */
   #header{
	   background:#f2f2f2;
	   width:100%;
	   height:50px;
	   position:fixed;
	   top:0px;
	   z-index:600;
	   padding:8px 0px;
   }

   #header .onlydesktop{
	   //padding-right: 150px;
   }
   .logo{
	   float:left;
	   width:30px;
	   height:30px;
		 cursor:pointer;
		 padding-top:4px;
   }
   .logo img{
	   width:100%;
   }
   .cerca{
	   width:30px;
	   height:30px;
	   background:url('../img/cerca.svg');
	   background-position:top center;
	   background-repeat:no-repeat;
	   background-size:100%;
	   display:inline-block;
	   margin:0px 5px;
	   cursor:pointer;		   
   }
    .mappa{
	   width:32px;
	   height:32px;
	   background:url('../img/mappa-icon.svg');
	   background-position:top center;
	   background-repeat:no-repeat;
	   background-size:100%;
	   display:inline-block;
	   margin:0px 5px;
	   cursor:pointer;
   }  
    .percorso{
	   width:32px;
	   height:32px;
	   background:url('../img/your-path.svg');
	   background-position:top center;
	   background-repeat:no-repeat;
	   background-size:100%;
	   display:inline-block;
	   margin:0px 5px;
	   cursor:pointer;
   }

	.percorso-quanto {
		position: absolute;
		width: 15px;
		height: 15px;
		border-radius: 15px;
		color: #fff;
		font-size: 0.8em;
		background: red;
		right: 3px;
		top: 18px;
		text-align: center;
		padding-top: 1px;
	}
	   
   /* MAPPA */

	.container-canvas{
		width:100%;
		height:100%;
		overflow:hidden;
		position:relative;
		background:white;
		overflow:hidden;
	}

	#map-container{
		width:700px;
		height:700px;
		position:relative;
		/* top:0px;
		left:-50%; */
		top:50px;
		margin:0 auto;
		background:white;
  -webkit-transform: translate(0px, 0px);
		  transform: translate(0px, 0px);
		  
		
	}
	.transitions{
	    -webkit-transition: all 0.5s ease-in-out;
	    -moz-transition: all 0.5s ease-in-out;
	    -o-transition: all 0.5s ease-in-out;
	    transition: all 0.5s ease-in-out;			
	}
	#line-container{
		position:relative;
		left:0px;
		top:0px;
		width:700px;
		height:700px;
		/*background:url("../img/backtesti.svg");*/
		background-size:100%;
		background-repeat:no-repeat;
	    -webkit-transition: all 0.5s ease-in-out;
	    -moz-transition: all 0.5s ease-in-out;
	    -o-transition: all 0.5s ease-in-out;
	    transition: all 0.5s ease-in-out;		
	}
	#line-container img{position:absolute;}
	.line-container__svg{
		position:absolute;
		width:100%;
		height:100%;
		
	}
	.line-container__svg svg{
		
		stroke-width:5;
		fill:none;
		opacity:0.8;
	}

	.line-container__svg .line-custom-color--red{
		stroke:red !important;
	}

	.line-container__svg .line-custom-color--light-blue{
		stroke: rgb(0, 153, 255) !important;
	}


	#input-container{
		position:absolute;
		left:0px;
		top:0px;
		z-index:400;	
	}
	#input-container .check{
		position:absolute;
	}
	#stGialla{
	    -webkit-transition: all 0.5s ease-in-out;
	    -moz-transition: all 0.5s ease-in-out;
	    -o-transition: all 0.5s ease-in-out;
	    transition: all 0.5s ease-in-out;
		stroke-dasharray: 1200;
		stroke-dashoffset: 1200;
		fill:none;
		stroke:#F6BC27;
		stroke-width:9;
		stroke-linejoin:round;
	}
	#stGialla.line-custom-color--red{
		stroke:red !important;
	}
	#stGialla.line-custom-color--light-blue{
		stroke:rgb(0, 153, 255) !important;
	}
	#stArancione{
	    -webkit-transition: all 0.5s ease-in-out;
	    -moz-transition: all 0.5s ease-in-out;
	    -o-transition: all 0.5s ease-in-out;
	    transition: all 0.5s ease-in-out;
		stroke-dasharray: 1200;
		stroke-dashoffset: 1200;
		fill:none;
		stroke:#f37d22;
		stroke-width:9;
		stroke-linejoin:round;		
	}
	#stBlu{
	    -webkit-transition: all 0.5s ease-in-out;
	    -moz-transition: all 0.5s ease-in-out;
	    -o-transition: all 0.5s ease-in-out;
	    transition: all 0.5s ease-in-out;
		stroke-dasharray: 2100;
		stroke-dashoffset: 2100;
		fill:none;
		stroke:#0e4799;
		stroke-width:9;
		stroke-linejoin:round;		
	}
	#stBlu.line-custom-color--red{
		stroke:red !important;
	}
	#stBlu.line-custom-color--light-blue{
		stroke:rgb(0, 153, 255) !important;
	}
	#stVerde{
	    -webkit-transition: all 0.5s ease-in-out;
	    -moz-transition: all 0.5s ease-in-out;
	    -o-transition: all 0.5s ease-in-out;
	    transition: all 0.5s ease-in-out;
		stroke-dasharray: 1210;
		stroke-dashoffset: 1210;
		fill:none;
		stroke:#11a511;
		stroke-width:9;
		stroke-linejoin:round;		
	}	
	#stViola{
	    -webkit-transition: all 0.5s ease-in-out;
	    -moz-transition: all 0.5s ease-in-out;
	    -o-transition: all 0.5s ease-in-out;
	    transition: all 0.5s ease-in-out;
		stroke-dasharray: 1350;
		stroke-dashoffset: 1350;
		fill:none;
		stroke:#a44699;
		stroke-width:9;
		stroke-linejoin:round;		
	}			
	.nodash{
		stroke-dashoffset:0 !important;
	}
@keyframes dash {
  from {
    stroke-dashoffset: 1000;
  }
  to {
    stroke-dashoffset: 0;
  }
}	
label{
	margin-bottom: 0px !important;
}
	/*CHECKBOXES*/
	@import url('https://fonts.googleapis.com/css?family=Lato');
	#ylwLine input[type="radio"] + label{
		color:#fff;
	}	
	#ylwLine input[type="radio"] + label span {
		background:url(../img/yellow-off.svg);
		background-repeat: no-repeat;
		background-position: center center;
		width: 40px;
		height: 40px;
		pointer-events: none;
	}
	#ylwLine input[type="radio"]:checked + label span {
	  background:url(../img/yellow-on.svg) !important;
	  background-repeat: no-repeat;
      width: 40px;
      height: 40px;
      pointer-events: none;
	}	
	#ylwLine #gialla-1 + label span{
	  background:url(../img/gialloverde.svg);
	  background-repeat: no-repeat;
	  width:40px;
	  height:40px;
	}			
	#bluLine input[type="radio"] + label{
		color:#fff;
	}	
	#bluLine input[type="radio"] + label span {
		/* background:url(../img/blu-off.svg);
		background-repeat: no-repeat;
		background-position: center center; */
		width: 40px;
		height: 40px;
	}

	#bluLine input[type="radio"]:checked + label span {
	background:url(../img/blu-on.svg) !important;
	background-repeat: no-repeat;
    width: 40px;
    height: 40px;
	}	
	#bluLine #blu-7 + label span{
	  background:url(../img/blugiallo.svg);
	  background-repeat: no-repeat;
	  width:40px;
	  height:40px;
	}
	#bluLine #blu-1 + label span{
	  background:url(../img/bluverde.svg);
	  background-repeat: no-repeat;
	  width:40px;
	  height:40px;
	}		
	#verdeLine input[type="radio"] + label{
		color:#fff;
	}	
	#verdeLine input[type="radio"] + label span {
		background:url(../img/green-off.svg);
		background-repeat: no-repeat;
		background-position: center center;
		width: 40px;
		height: 40px;
	}
	#verdeLine input[type="radio"]:checked + label span {
	  background:url(../img/green-on.svg);
	  background-repeat: no-repeat;
    width: 40px;
    height: 40px;
	}

	#arancioneLine input[type="radio"] + label{
		color:#fff;
	}	
	#arancioneLine input[type="radio"] + label span {
		background:url(../img/orange-off.svg);
		background-repeat: no-repeat;
		background-position: center center;
		width: 40px;
		height: 40px;
	}	
	#arancioneLine input[type="radio"]:checked + label span {
	  background:url(../img/orange-on.svg) !important;
	  background-repeat: no-repeat;
      width: 40px;
    	height: 40px;
	}	
	#arancioneLine #arancione-4 + label span{
	  background:url(../img/arancioverde.svg);
	  background-repeat: no-repeat;
	  width:40px;
	  height:40px;
	}	
	#violaLine input[type="radio"] + label{
		color:#fff;
	}	
	#violaLine input[type="radio"]:checked + label span {
		background:url(../img/purple-on.svg) !important;
		background-repeat: no-repeat;
		background-position: center center;
    width: 40px;
    height: 40px;
	}

	#violaLine input[type="radio"] + label span {
	  background:url(../img/purple-off.svg);
	  background-repeat: no-repeat;
	  width:40px;
	  height:40px;
	}
	#violaLine #viola-4 + label span{
	  background:url(../img/violaverde.svg);
	  background-repeat: no-repeat;
	  width:40px;
	  height:40px;
	}
	#violaLine #viola-2 + label span{
	  background:url(../img/violaverde.svg);
	  background-repeat: no-repeat;
	  width:40px;
	  height:40px;
	}	
	.custom-checkbox{
		position:absolute;
	}
	.custom-checkbox input[type="radio"] {
	-webkit-appearance: none;		
	  display: none;
	}

	.custom-checkbox input[type="radio"] + label {
	  color: #292321;
	  font-family: Arial, sans-serif;
	  font-size: 14px;
	}

	.custom-checkbox input[type="radio"] + label span {
	  pointer-events: none;
	  display: inline-block;
	  width: 24px;
	  height: 24px;
	  vertical-align: middle;
	  cursor: pointer;
	  -moz-border-radius: 50%;
	  border-radius: 50%;
	}

	.custom-checkbox input[type="radio"] + label span {
	  /*background-color: #292321;*/
	}

	.custom-checkbox input[type="radio"]:checked + label span {
	  background-color: #CC3300;
	}

	.custom-checkbox input[type="radio"] + label .service-unselected {
		display:block;
	  }

	  .custom-checkbox input[type="radio"] + label .service-selected {
		display:none;
	  }

	  .custom-checkbox input[type="radio"]:checked + label .service-unselected {
		display:none;
	  }
  
	  .custom-checkbox input[type="radio"]:checked + label .service-selected {
		display:block;
	  }

	   /*colori-standard*/

	   .circle-border.circle-border--blu{
		stroke: #0e4799!important;
	  }

	  .circle-fill.circle-fill--blu{
		fill: #0e4799!important;
	  }

	  .circle-border.circle-border--gialla{
		stroke: #f6bc27!important;
	  }

	  .circle-fill.circle-fill--gialla{
		fill: #f6bc27!important;
	  }

	  .circle-border.circle-border--verde{
		stroke: #11a511!important;
	  }

	  .circle-fill.circle-fill--verde{
		fill: #11a511!important;
	  }

	  .circle-border.circle-border--arancione{
		stroke: #f37d22!important;
	  }

	  .circle-fill.circle-fill--arancione{
		fill: #f37d22!important;
	  }

	  .circle-border.circle-border--viola{
		stroke: #a44699!important;
	  }

	  .circle-fill.circle-fill--viola{
		fill: #a44699!important;
	  }

	  /*colori-custom*/
	  .circle-border.line-custom-color--red{
		stroke: red!important;
	  }

	  .circle-fill.line-custom-color--red{
		fill: red!important;
	  }

	  /*colori-custom*/
	  .circle-border.line-custom-color--light-blue{
		stroke: rgb(0, 153, 255) !important;
	  }

	  .circle-fill.line-custom-color--light-blue{
		fill: rgb(0, 153, 255) !important;
	  }

	 


	
	/*ALTRE INFO UI*/
	#macroservizi,#ilPercorso,#cerca,#referente{
		position: absolute;
		top: 0;
		right: 0;
		min-height: 100%;
		padding-top: 50px;
		background: rgba(250, 250, 250, 0.95);
		z-index:500;
		-webkit-animation-name: example; /* Safari 4.0 - 8.0 */
		-webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
		animation-name: example;
		animation-duration:0.4s;	  
	}

	@media screen and (max-width: 1024px){
		#macroservizi,#ilPercorso,#cerca,#referente{
			padding-bottom:70px;
			overflow-y:scroll;
			max-height:100vh;
		}
	}

	#sottoSelezionati input[type=checkbox]{
		float:left;
		margin-right:15px !important;
		margin-bottom:2px;
	}
	#referente{
		position:fixed;
		bottom:0px;
		overflow-y: scroll;
	}
	@keyframes example {
		0%   {left:-100%; opacity:0;}
		100%  {left:0%; opacity:1}
	}	
	#ilPercorso .modal .modal-backdrop{
		background-color:none !important;
		z-index:0 !important;
	}
	.modal-backdrop{
		z-index:0 !important;
	}	
	#macro-container{
		position:relative;
	}
	.line-blu-separator{
		border-bottom:1px solid #0e4799;
		padding:15px 0px;
		color:#0e4799;
	}
	.line-blu-separator span{
		text-transform:uppercase;
		font-weight:medium;
		font-size:12px;
	}
	
	#sottoSelezionati .line-blu-separator span{
		width:100%;
		display:inline-block;
	}
	.line-blu-separator .gialla h5{
		font-weight:medium;
		border-top-width: 50px;
		border-top:10px solid #f6bc27;
		padding-top:10px;
		max-width:48px;
		color:#f6bc27;
	}
	.line-blu-separator .blue h5{
		font-weight:medium;
		border-top-width: 50px;
		border-top:10px solid #0e4799;
		padding-top:10px;
		max-width:48px;
		color:#0e4799;
	}
	.line-blu-separator .verde h5{
		font-weight:medium;
		border-top-width: 50px;
		border-top:10px solid #11a511;
		padding-top:10px;
		max-width:48px;
		color:#11a511;
	}
	.line-blu-separator .arancione h5{
		font-weight:medium;
		border-top-width: 50px;
		border-top:10px solid #f37d22;
		padding-top:10px;
		max-width:48px;
		color:#f37d22;
	}	
	.line-blu-separator .viola h5{
		font-weight:medium;
		border-top-width: 50px;
		border-top:10px solid #a44699;
		padding-top:10px;
		max-width:48px;
		color:#a44699;
	}				

	.relative .line-blu-separator p{	
		margin:0px;
	}
	.line-blu-separator p{
		margin:20px 0px;
	}
	.line-blu-separator .row p{
		margin:0px;
	}
	.nopadding .plus{
		margin:10px 0px;
	}
	.nopadding .minus{
		
	}		
	.plus{
		width:15px;
		height:15px;
		background:url('../img/plus.svg');
		margin:45px 0px 0px;
		cursor:pointer;
	}	
	.minus{
		width:15px;
		height:15px;
		background:url('../img/minus.svg');
		margin:45px 0px 0px;
		cursor:pointer;
	}
	.listes{
	}
	.servizioInlista{
		margin:20px 0px;
	}
	
	/*INFO UI FONDO*/
	#ui-button-selected{
		position:absolute;
		background: rgba(250, 250, 250, 0.95);
		min-height:115px;
		border-top: 2px solid #0e4799;
		right:0px;
		bottom:0px;
		padding-top:15px;
		 /*overflow-y:scroll;*/
		z-index:400;
	}
	#ui-may-add{
		height:45px;
		position:absolute;
		right:20px;
		top:-15px;
	}
    .aggiungi{
	   /* width:250px;
	   height:40px;
	   background:url('../img/AggiungiPercorso_on.svg');
	   background-position:top center;
	   background-repeat:no-repeat;
	   background-size:100%; */
	   display:inline-block;
	   cursor:pointer;
	   position: fixed;
		 bottom: 16px;  
		 width: 29%;
		 right: 0;
		 bottom: 0;
		 padding: 13px 32px;	
		 background: #154575;
    color: white;
    
 
    border: none;
    text-transform: uppercase;
    font-size: 1.1rem;   
	 } 

	 .aggiungi[disabled]{
		background:#ccc;
	}
	 
	 @media screen and (max-width:1024px){
		.aggiungi{
		 width:100%;
		}
	 }
   .aggiungi-disabled{
   	   background:url('../img/AggiungiPercorso_off.svg');
 	   width:250px;
	   height:40px;
	   background-position:top center;
	   background-repeat:no-repeat;
	   background-size:100%;
	   display:inline-block;
	   cursor:pointer;
	   position: fixed;
	   bottom: 0px;  	
   }

   .btn--round{
	background: #154575;
    color: white;
    padding: 8px 32px;
 
    border: none;
    text-transform: uppercase;
    font-size: 1.1rem;
	
	 }
	 
	 .btn--full{
		background: #154575;
			color: white;
			padding: 8px 32px;
			width:100%;
			border: none;
			text-transform: uppercase;
			font-size: 1.1rem;
		
		 }

		

		 .btn--full--form-button{
			position:fixed !important;
			right:0px;
			bottom:0px;
			padding:15px 32px;
			display: flex;
			justify-content: space-between;
			align-items: center;

			
		 }

		 .btn--full--form-button .forward{
			display: inline-block;
			filter: brightness(1000%);
		 }

		 @media screen and (min-width:1024px){
			.btn--full--form-button{
			 width:29% !important;
			}
		 }

   .btn--round[disabled]{
	   background:#ccc;
	 }
	 
	 .btn--full[disabled]{
		background:#ccc;
	}

	.form-button-container{
		box-sizing:content-box;
	}

   .partireda{
    font-size: 0.9em;
    font-weight: lighter;
    padding-left: 27px;
    text-transform: initial;
    min-height:2px;
    width:100%;
	}  		
    .chiama{
	   width:40px;
	   height:40px;
	   background:url('../img/chiama.svg');
	   background-position:top center;
	   background-repeat:no-repeat;
	   background-size:100%;
	   display:inline-block;
	   margin:0px 5px;
	   cursor:pointer;
   }
   .deslunga{
   		text-transform: none !important;
   		font-weight: normal !important;
   }

	/*IL TUO PERCOROS*/
	.selezionato_path_gialla{
		width:50px;
		height:50px;
		border:solid 5px #f6bc27;
		
	}
	.selezionato_path_blu{
		width:50px;
		height:50px;
		border:solid 5px #0e4799;
		
	}

	.selezionato_path_verde{
		width:50px;
		height:50px;
		border:solid 5px #11a511;
		
	}
	.selezionato_path_arancione{
		width:50px;
		height:50px;
		border:solid 5px #f37d22;
		
	}
	.selezionato_path_viola{
		width:20px;
		height:20px;
		border:solid 5px #a44699;
	}				
	.remove,.removesmall{
		width:25px;
		height:25px;
		background:url('../img/remove.svg');
		background-size:100%;
		background-position:top center;
		background-repeat:no-repeat;
		cursor:pointer; 
	}
	.remove{
		margin-right:7px;
	}
	.removesmall{
		width:20px !important;
		height: 20px !important;
		position: absolute;
		top:-1px;
		right: 10px;
	}
	#ilPercorso li h5{
		max-width:65%;
	}
	.removeall{
		width:30px;
		height:30px;
		background:url('../img/removeall.svg');
		background-size:100%;
		background-position:top center;
		background-repeat:no-repeat;
		cursor:pointer;
		margin-right:7px;
	}
	.back{
		width:25px;
		height:25px;
		background:url('../img/back.svg');
		background-size:100%;
		background-position:top center;
		background-repeat:no-repeat;
		cursor:pointer;
	}
	.forward{
		width:20px;
		height:20px;
		background:url('../img/forward.svg');
		background-size:100%;
		background-position:top center;
		background-repeat:no-repeat;
		cursor:pointer;
	}	
	.send{
		width:25px;
		height:25px;
		background:url('../img/send.svg');
		background-size:100%;
		background-position:top center;
		background-repeat:no-repeat;
		cursor:pointer;
	}	
	#footer-buttons{
		width:100%;
		position:fixed;
		bottom:16px;
		height:40px;
		/* background:#0e4799; */
		padding:10px 0px;
		right:0px;
		color:white;
		font-size:12px;
	}

	
	.lineup{
		float:left;
		width:2px;
		height:20px;
		background:#fff;
	}
	#ilPercorso ul{
		padding:20px 0px 0px 0px;
	}
	#ilPercorso ul li{
		float:left;
		width:100%;
		margin:5px 0px;
		position: relative;
	}
	#ilPercorso h6{
		margin-top: 5px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	#ilPercorso h7{font-size:0.8em;}
	.max70{
		max-width:70%;
		float:left;
	}
.greyline {
    width: 10px;
    position: absolute;
    height: 100%;
    background-color: #e5e5e5;
    left: 25px;
}
/*ESTREMI */
#estremiContainer img {
	position: absolute;
	width:24px;
	height:24px;
}

#estremiContainer .line-end{
	position: absolute;
	width:24px;
	height:24px;
}
#hub{
	position: absolute;
	top:134px;
	left:134px;
	cursor: pointer;
}
.hubon{
	width:44px;
	height:44px;
	background: url('../img/hub_on.svg');
	background-size: 100%;
	background-repeat: no-repeat;
}
.huboff{
	width:44px;
	height:44px;
	background: url('../img/hub_off.svg');
	background-size: 100%;
	background-repeat: no-repeat;
}
.centraMsg {
    height: 345px;
    position: absolute;
    top: 50%;
    margin-top: -176px;
    left: 50%;
    width: 80%;
    margin-left: -40%;
    font-size: 0.95em;
}

/* ==========================================================================
   Media Queries
   ========================================================================== */
@media only screen and (min-width: 1024px) {
	#map-container{
		left: 25%;
		top: 6%;
		margin:0;
	}
	#welcoma{
		width: 70%;
	}

	.hamburger-box{
		display: none !important;
	}

	
	#macroservizi, #ilPercorso, #cerca, #referente,#ui-button-selected{
	    width: 29%;
	    max-height: 100%;
	    overflow-y: scroll;
	}
	#ui-button-selected{
		min-height: auto !important;
		top:30px;
	}
	#ui-button-selected .plus{
		background: url('../img/plus-desktop.svg') !important;
		width: 115px;
	}
	#ui-may-add {
		position: fixed;
	    top: 60px;
	    right: 30px;
	    z-index: 400;
	}
	#macroservizi .container,#ilPercorso .container,#cerca .container,#referente .container,#ui-button-selected .container{
		width:auto !important;
	}
	.line-blu-separator{
		border-bottom: 0px;
	}

	#footer-buttons{
	    width: 29%;		
	}
	#cerca li{
		cursor: pointer;
	}
	#macroservizi .col-lg-12,#ilPercorso .col-lg-12,#cerca .col-lg-12,#referente .col-lg-12,#ui-button-selected .col-lg-12{
		float:right !important;
	}
	.selezionato_path_gialla,.selezionato_path_arancione,.selezionato_path_viola,.selezionato_path_verde,.selezionato_path_blu{
		width:30px;
		height: 30px;
	}
	#welcoma h3,#welcoma2 h3,#message h2{
	margin-bottom: 50px !important;
	}
	#welcoma h5{
	margin-top: 45px !important;
	}	
	#welcoma p,#welcoma2 p,#message p{
		width:500px;
		margin:0px auto;
	}
	#listaDesktop .col-lg-12{
		cursor: pointer;
	}
	.line-blu-separator .blue h5,.line-blu-separator .verde h5,.line-blu-separator .gialla h5,.line-blu-separator .arancione h5,.line-blu-separator .viola h5{
		width: 70px;
	}		
}

@media only screen and (max-width: 1024px) {
	#ui-button-selected.altezzamassima{
		height: 100vh ;
		
		box-sizing: border-box;
		
	}



	.selezionato_path_gialla,.selezionato_path_blu,.selezionato_path_verde,.selezionato_path_arancione,.selezionato_path_viola{
		width:30px;
		height:30px;
	}
}

@media only screen and (min-width: 1024px) {
	#listaDesktop .container{
		width: 100% !important;
	}
}
@media only screen and (max-width: 900px) {
	.onlydesktop{
		display: none !important;
	}	

	
}


@media only screen and (min-width: 800px){
	#listaDesktop {
	position: absolute;
	width:25%;
    top: 0;
    left: 0;
    height:100%;
    padding-top: 50px;
    overflow-y: scroll;
    background: rgba(250, 250, 250, 0.95);
    z-index: 500;
    -webkit-animation-name: example;
    -webkit-animation-duration: 4s;
    animation-name: example;
    animation-duration: 0.4s;
	}
}

@media only screen and (max-width: 700px){
	#map-container{
		width:100%;
		height:auto;
	}
	 .aggiungi{
	   /* width:250px;
	   height:40px;
	   background:url('../img/AggiungiPercorso_on.svg');
	   background-position:top center;
	   background-repeat:no-repeat;
	   background-size:100%; */
	    width: 106vw;
    left: -15px;
    bottom: 0;
    border-radius: 0;
	    padding: 17px 0;	   
   } 
}

@media only screen and (max-width: 600px) {
	/*se altezza massima*/
	.altezzamassima{
    height: 100%;
    padding-top: 85px !important;
	}
	.altezzamassima>.line-blu-separator{
    overflow-y: scroll;
    height: auto;
    border-bottom: 0px;
	}
   .partireda{
    font-size: 0.9em;
    font-weight: lighter;
    padding-left: 27px;
    text-transform: initial;
    min-height:2px;
    width:100%;
    float: left;
	} 	
}

@media only screen and (max-width: 1023px) {
	.altezzamassima #ui-may-add{

		top:55px;
		right:20px;
		z-index:800;
		position:fixed;
	}
}

@media only screen and (max-width: 500px) {
	#header .col-xs-6{
		padding:0px;
	}
	#ui-button-selected .col-xs-1{
		padding: 0px 10px;
	}

	#ui-may-add{

		top:-15px;
		right:-7px;
	}
	.altezzamassima #ui-may-add{
		/* position:fixed;
		top:100px;
		right:11px; */
		top:55px;
		right:20px;
		z-index:800;
		position:fixed;
	}
	#footer-buttons{
		font-size:10px;
	}
	/* .path-buttons-container{
		padding: 0;
	}
	.path-buttons-container button{
		border-radius: 0;
		width: 50%;
		padding:17px 0;
		font-size: 1rem;
		position: relative;
	}
	.path-buttons-container button:first-child:after{
		content:'';
		position: absolute;
		height: 30px;
		width: 2px;
		background:white;
		right:0;
		top: 10px;
	} */
	#welcoma2 h5{
		font-size: 11px;
	}
	#welcoma {
	    position: fixed;
	    top: 55%;
	    left: 50%;
	    margin-left: -40%;
	    padding: 20px;
	    z-index: 1000;
	    background-color: rgba(21, 68, 117, 0.8);
	    width: 80%;
	    color: white;
	    text-align: center;
	    font-size: 1.2em;
	    height: 450px;
	}		
}

@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {

}

/* ==========================================================================
   Helper classes
   ========================================================================== */

.hidden {
    display: none !important;
    visibility: hidden;
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   Print styles
   ========================================================================== */

@media print {
    *,
    *:before,
    *:after {
        background: transparent !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group;
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}

.line-title-container{
	display:flex;
	justify-content: flex-start;
}

.line-title.line-custom-color--red{
	color: red !important;
	border-top-color:red !important;
}

.line-title.line-custom-color--light-blue{
	color:  rgb(0, 153, 255) !important; !important;
	border-top-color: rgb(0, 153, 255) !important; !important;
}

.selezionato_path{
	background: white;
    border-radius: 50%;
}

.selezionato_path.line-custom-color--light-blue{
	border:solid 5px rgb(0, 153, 255);
}

.selezionato_path.line-custom-color--red{
	border:solid 5px red
}

.tutorial{
	position:fixed;
	margin:auto;
	width: 100vw;
	height: 100vh;
	z-index: 999999999;
	min-height:650px;
	
	align-items: center;
	justify-content: center;
	display:none
}

.tutorial--show{
	display:flex;
}

.tutorial__inner{
	width: 100%;
    height: 80%;
	max-width:992px;
	
	background: -moz-linear-gradient(45deg, rgba(21,69,117,0.9) 0%, rgba(31,112,178,0.9) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(45deg, rgba(21,69,117,0.9) 0%,rgba(31,112,178,0.9) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(45deg, rgba(21,69,117,0.9) 0%,rgba(31,112,178,0.9) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6154575', endColorstr='#e61f70b2',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

@media screen and (max-width:1024px){
	.tutorial{
		box-sizing:border-box;
		padding:20px;
		
	}
	.tutorial__inner{
		width:100%;
		height:100%;
	}
}

@media screen and (max-width:767px){
	.tutorial{
	 display: flex;
    align-items: center;
    min-height: 100vh;
    /* margin: 0; */
    padding: 0;
	align-content: center;
    justify-content: center;

	}
	.tutorial__inner{
	width: 90%;
    height: 70%
	}
	#footer-buttons .container{
		padding: 0;
	}
}

.vueperslides{
	height:100%;
}

.vueperslides__inner{
	height:100%;
}

.vueperslides__parallax-wrapper{
	height:100%;
	padding:0 !important;
}

.vueperslides__slide-content{
	width: 100%;
    height: 100%;
}

.slide-content{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tutorial__slide{
	width:100%;
	height:100%;
	display: flex;
	align-items:center;
	justify-content: center;
}

.tutorial__slide__round-wrapper{
	background:white;
	width:212px;
	height:212px;
	border-radius:50%;
	display: flex;
	justify-content: center;
	align-items:center;
	position: relative;
	
}

.tutorial__slide__image{
	width:100%;
	height:100%;
	position: absolute;
	top:0;
	left: 0;
}

.tutorial__slide{
	width:100%;
	height:100%;
	padding: 0 33px;
}

.vueperslides__bullets{
	position:static;
}
@media screen and (max-width:768px){
	.vueperslides__bullets{
		bottom:-30px;
	}
}

.vueperslides__bullet{
	opacity:0.5;
	box-shadow:none !important;
	border:none !important;
	background:white !important;
	width:8px;
	height: 8px;
	border-radius:50%;
	display: block;
	padding:0;
	margin:0 8px;
}

.vueperslides__bullet--active{
	opacity:1;
}

.vueperslides__bullet span{
	display: none;
}

.tutorial__slide__inner{
	display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.tutorial__slide__title{
	text-align:center;
	color:white;
	margin-top:25px;
	margin-bottom:10px;
	font-family: Roboto;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	font-size: 16px;
}

.tutorial__slide__text{
	text-align:center;
	color:white;
	max-width:475px;
	font-family: Roboto;
	font-style: normal;
	font-weight: normal;
	line-height: normal;
	font-size: 11px;
}

.mT-15{
	margin-top:15px !important;
}

.mB-15{
	margin-bottom:15px !important;
}

.mT-25{
	margin-top:25px !important;
}

.mB-10{
	margin-bottom:10px !important;
}

.tutorial__bottom{
	position: relative;
		bottom: -37px;
		display: flex;
    justify-content: space-between;
}

.vueperslides__parallax-wrapper::after{
	content:none !important;
}

.tutorial__inner{
	padding-bottom: 70px;
}

.tutorial__bottom__button{
	background:none;
	border:none;
	color:white;
	padding: 12px 6px;
	font-family: Roboto;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	font-size: 15px;
}

.vueperslides__arrow--next{
    right: -6px !important;
    width: auto !important;
    bottom: -80px;
    top: auto !important;
	transform: none !important;
	opacity:1 !important;
	background: none;
    border: none;
	
}

.vueperslides__arrow--prev{
	display:none;
}

@media screen and (min-width:769px){
	.tutorial__slide__round-wrapper{
		background:white;
		width:295px;
		height:295px;
		border-radius:50%;
		
	}

	.tutorial__slide__text{
		font-family: Roboto;
		font-style: normal;
		font-weight: normal;
		line-height: normal;
		font-size: 18px;
	}

	.tutorial__slide__title{
		font-family: Roboto;
		font-style: normal;
		font-weight: 500;
		line-height: normal;
		font-size: 24px;
	}
}

.tutorial__slide__round-icon-container{
	background-color:#ededed;
	width:42px;
	height:42px;
	border-radius:50%;
	display:flex;
	align-items:center;
	justify-content: center;
	position: absolute;
	bottom:-21px;
}

.tutorial__slide__round-icon-container--transparent{
	background-color:transparent;
}

.tutorial__slide__round-icon--plus{
	width:16px;
	height:16px;
}

.tutorial__slide__round-icon--path{
	width:100%;
	height:100%;
}

.tutorial__slide__round-icon--contact{
	width:42px;
	height:42px;
}

.tutorial__path-count{
	right: 0px;
    top: 26px;
}

.fake-cursor{
	position: absolute;
	opacity: 0;
	width:32px;
	height:32px;
	border-radius:50%;
	
	background:#ededed;
	border:solid 1px white;
	top:50%;
	left:0;
}

.row--referent{
	display:flex;
	align-items: center;
}


.footer{
	position: fixed;
    bottom: 0px;
    left:0;
    width: 25%;
	background: -moz-linear-gradient(45deg, rgba(21,69,117,0.9) 0%, rgba(31,112,178,0.9) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(45deg, rgba(21,69,117,0.9) 0%,rgba(31,112,178,0.9) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(45deg, rgba(21,69,117,0.9) 0%,rgba(31,112,178,0.9) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6154575', endColorstr='#e61f70b2',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	transition: all 0.3s ease-out;
	height:40px;
	color:white;

	padding-left: 15px;
    padding-right: 23px;
		box-sizing: border-box;
		
		overflow-y:scroll;
	
}

@media screen and (max-width:1023px){
	.footer{
		width:100%;
	}
	.tutorial__slide{
	padding-top: 50px;
}
}

.footer.footer--isOpen{
	height:100%;
	padding-top:50px;
}
.footer__head{
	
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content: space-between;
	padding-left: 0px;
    padding-right: 0;
	height:40px;
}

.footer__head>span{
	text-transform: uppercase;
	
    font-size: 1.1rem;
}

.footer.footer--isOpen .footer__head{
	border-bottom:solid 1px white;
}

.footer__toggle-button{
	background:none;
	border:none;
	
		cursor: pointer;
		padding-right:0;
}

.footer__toggle-button svg{
	width: 20px;
	transform: rotate(-90deg);
	transition:transform .3s ease-out;
}

.footer.footer--isOpen .footer__toggle-button svg{
	transform: rotate(90deg) !important;
}


@media screen and (max-width:1023px){
	
	.footer__toggle-button{
		padding-right: 0;
	}
	.footer__toggle-button svg{
		    width: 17px;
	}
}


.footer__toggle-button .st0{
	fill:white;
}

.footer__body{
	/*height:100%;*/
	
}

#listaDesktop{
	padding-bottom:40px;
}

.tutorial__slide__image--ripple{
	width:48px;
	height:48px;

	
}

@media screen and (min-width: 769px){
	
	.tutorial__slide__image--ripple{
		width: 64px;
	height: 64px;
	
	
		
	}
}


.footer-item__head{
	display:flex;
	justify-content: space-between;
	align-items:center;
	cursor:pointer;
}

.footer-item__head h3{
	text-transform: uppercase;
    font-size: 1.1rem;
}

.footer-item__head-icon{
	width:15px;
	height:15px;
}

.footer-item__head-icon .st0{
	fill:white;
}

.footer-item__body{
	padding-bottom:20px;
}

.logo--negative {
	float:none;
	width:50px;
	height:50px;
	margin:15px 0;
}

.logo--negative .st0{
	fill:white;
	
}

.footer__link-container{
	display:flex;
	justify-content:space-between;
	align-items:center;
	margin-top:20px;
}

.footer-item__link-container a, 
.footer-item__link-container a:visited, 
.footer-item__link-container a:active, 
.footer-item__link-container a:hover{
	color:white !important;
	text-decoration: underline;
}

.footer-item__body a, 
.footer-item__body a:visited, 
.footer-item__body a:active, 
.footer-item__body a:hover{
	color:white;
	text-decoration: underline;
}

.footer__link-icon{
	width:15px;
	height:15px;
	position: relative;
    top: -3px;
}

.footer__link-icon .st0{
	fill:white;
}



.circle-effect{
	opacity:0;
	fill:#1368bc;
	transform:scale(0.01);
	transform-origin: center 235px;
	transition:all .3s ease-in;
}

.circle-effect--open{
	opacity:1;
	transform:scale(1);
}


.tutorial__slide__image--svg .st0{fill:#FFFFFF;}
.tutorial__slide__image--svg .st1{fill:none;stroke:#154575;stroke-width:2.7318;stroke-linecap:round;stroke-miterlimit:10;}
.tutorial__slide__image--svg .st2{fill:#154575;}
.tutorial__slide__image--svg .st3{fill:#F37D22;}
.tutorial__slide__image--svg .st4{fill:none;stroke:#666666;stroke-width:1.1409;stroke-miterlimit:10;}
.tutorial__slide__image--svg .st5{fill:#154575;stroke:#154575;stroke-width:1.1409;stroke-miterlimit:10;}


.tutorial__slide__image--svg--2 .st0{fill:#FFFFFF;}
.tutorial__slide__image--svg--2 .st1{fill:#154575;}
.tutorial__slide__image--svg--2 .st2{fill:none;stroke:#E6E6E6;stroke-width:14.1195;stroke-miterlimit:10;}
.tutorial__slide__image--svg--2 .st3{fill:#666666;}
.tutorial__slide__image--svg--2 .st4{fill:#F37D22;}
.tutorial__slide__image--svg--2 .st5{fill:#A44699;}

.cookie-law-container{
	position:fixed;
	top:50px;
	left:0;
	width:100%;
	background: -moz-linear-gradient(45deg, rgba(21,69,117,0.9) 0%, rgba(31,112,178,0.9) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(45deg, rgba(21,69,117,0.9) 0%,rgba(31,112,178,0.9) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(45deg, rgba(21,69,117,0.9) 0%,rgba(31,112,178,0.9) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6154575', endColorstr='#e61f70b2',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	
	z-index:9999999999;
	padding:10px;
	
	justify-content: space-between;
	align-items:center;
	display: none;
}

.cookie-law-container--show{
	display:flex;
}

.cookie-law-container p,
.cookie-law-container a,
.cookie-law-container a:hover,
.cookie-law-container a:visited
{
	color:white;
}

.cookie-law-container a{
	text-decoration:underline;
}

.cookie-law-container button{
	color:white;
	background:none;
	border:none;
	font-size:20px;
}

.start-button{
	background:none;
	border:solid 3px white;
	padding:3px;
	border-radius:50%;
	width:40px;
	height:40px;
	box-sizing:border-box;
	display: inline-block;
	cursor:pointer;
}

.start-button__inner{
	width:100%;
	height:100%;
	border-radius:50%;
	background:white;
	opacity:0.5;
	transition:opacity .3s;
}

.start-button__inner:hover{
	opacity:1;
}

#ilPercorso{

	overflow-y: auto;
}

.tutorial__plane-icon, .tutorial__check-icon{

	
	position: absolute;
	width:20px;
	height:20px;
	bottom: 53px;
	right: 72px;
	opacity:0;

	
}

@media screen and (max-width: 768px) {
	.tutorial__plane-icon, .tutorial__check-icon{

	
		
		width:15px;
		height:15px;
		bottom: 37px;
		right: 51px;
		
	
		
	}
}

.tutorial__check-icon{

	filter: invert(100%);
}


.line-custom-color--Blu-1.line-title {
  color: #0E4799 !important;
  border-top-color: #0E4799 !important;
}
.line-custom-color--Blu-1.selezionato_path {
  border: solid 5px #0E4799 !important;
}
.line-custom-color--Blu-1.st1, .line-custom-color--Blu-1.circle-fill {
  fill: #0E4799 !important;
}
.line-custom-color--Blu-1.circle-border {
  stroke: #0E4799 !important;
}

.line-container__svg .line-custom-color--Blu-1 {
  stroke: #0E4799 !important;
}

#stGialla.line-custom-color--Blu-1, #stBlu.line-custom-color--Blu-1, #stVerde.line-custom-color--Blu-1, #stArancione.line-custom-color--Blu-1, #stViola.line-custom-color--Blu-1 {
  stroke: #0E4799 !important;
}

.line-custom-color--Blu-2.line-title {
  color: #3290B4 !important;
  border-top-color: #3290B4 !important;
}
.line-custom-color--Blu-2.selezionato_path {
  border: solid 5px #3290B4 !important;
}
.line-custom-color--Blu-2.st1, .line-custom-color--Blu-2.circle-fill {
  fill: #3290B4 !important;
}
.line-custom-color--Blu-2.circle-border {
  stroke: #3290B4 !important;
}

.line-container__svg .line-custom-color--Blu-2 {
  stroke: #3290B4 !important;
}

#stGialla.line-custom-color--Blu-2, #stBlu.line-custom-color--Blu-2, #stVerde.line-custom-color--Blu-2, #stArancione.line-custom-color--Blu-2, #stViola.line-custom-color--Blu-2 {
  stroke: #3290B4 !important;
}

.line-custom-color--Blu-3.line-title {
  color: #56D8CF !important;
  border-top-color: #56D8CF !important;
}
.line-custom-color--Blu-3.selezionato_path {
  border: solid 5px #56D8CF !important;
}
.line-custom-color--Blu-3.st1, .line-custom-color--Blu-3.circle-fill {
  fill: #56D8CF !important;
}
.line-custom-color--Blu-3.circle-border {
  stroke: #56D8CF !important;
}

.line-container__svg .line-custom-color--Blu-3 {
  stroke: #56D8CF !important;
}

#stGialla.line-custom-color--Blu-3, #stBlu.line-custom-color--Blu-3, #stVerde.line-custom-color--Blu-3, #stArancione.line-custom-color--Blu-3, #stViola.line-custom-color--Blu-3 {
  stroke: #56D8CF !important;
}

.line-custom-color--Verde-1.line-title {
  color: #00665E !important;
  border-top-color: #00665E !important;
}
.line-custom-color--Verde-1.selezionato_path {
  border: solid 5px #00665E !important;
}
.line-custom-color--Verde-1.st1, .line-custom-color--Verde-1.circle-fill {
  fill: #00665E !important;
}
.line-custom-color--Verde-1.circle-border {
  stroke: #00665E !important;
}

.line-container__svg .line-custom-color--Verde-1 {
  stroke: #00665E !important;
}

#stGialla.line-custom-color--Verde-1, #stBlu.line-custom-color--Verde-1, #stVerde.line-custom-color--Verde-1, #stArancione.line-custom-color--Verde-1, #stViola.line-custom-color--Verde-1 {
  stroke: #00665E !important;
}

.line-custom-color--Verde-2.line-title {
  color: #11A511 !important;
  border-top-color: #11A511 !important;
}
.line-custom-color--Verde-2.selezionato_path {
  border: solid 5px #11A511 !important;
}
.line-custom-color--Verde-2.st1, .line-custom-color--Verde-2.circle-fill {
  fill: #11A511 !important;
}
.line-custom-color--Verde-2.circle-border {
  stroke: #11A511 !important;
}

.line-container__svg .line-custom-color--Verde-2 {
  stroke: #11A511 !important;
}

#stGialla.line-custom-color--Verde-2, #stBlu.line-custom-color--Verde-2, #stVerde.line-custom-color--Verde-2, #stArancione.line-custom-color--Verde-2, #stViola.line-custom-color--Verde-2 {
  stroke: #11A511 !important;
}

.line-custom-color--Verde-3.line-title {
  color: #D1D841 !important;
  border-top-color: #D1D841 !important;
}
.line-custom-color--Verde-3.selezionato_path {
  border: solid 5px #D1D841 !important;
}
.line-custom-color--Verde-3.st1, .line-custom-color--Verde-3.circle-fill {
  fill: #D1D841 !important;
}
.line-custom-color--Verde-3.circle-border {
  stroke: #D1D841 !important;
}

.line-container__svg .line-custom-color--Verde-3 {
  stroke: #D1D841 !important;
}

#stGialla.line-custom-color--Verde-3, #stBlu.line-custom-color--Verde-3, #stVerde.line-custom-color--Verde-3, #stArancione.line-custom-color--Verde-3, #stViola.line-custom-color--Verde-3 {
  stroke: #D1D841 !important;
}

.line-custom-color--Giallo-1.line-title {
  color: #F6BC27 !important;
  border-top-color: #F6BC27 !important;
}
.line-custom-color--Giallo-1.selezionato_path {
  border: solid 5px #F6BC27 !important;
}
.line-custom-color--Giallo-1.st1, .line-custom-color--Giallo-1.circle-fill {
  fill: #F6BC27 !important;
}
.line-custom-color--Giallo-1.circle-border {
  stroke: #F6BC27 !important;
}

.line-container__svg .line-custom-color--Giallo-1 {
  stroke: #F6BC27 !important;
}

#stGialla.line-custom-color--Giallo-1, #stBlu.line-custom-color--Giallo-1, #stVerde.line-custom-color--Giallo-1, #stArancione.line-custom-color--Giallo-1, #stViola.line-custom-color--Giallo-1 {
  stroke: #F6BC27 !important;
}

.line-custom-color--Arancio-1.line-title {
  color: #F37D22 !important;
  border-top-color: #F37D22 !important;
}
.line-custom-color--Arancio-1.selezionato_path {
  border: solid 5px #F37D22 !important;
}
.line-custom-color--Arancio-1.st1, .line-custom-color--Arancio-1.circle-fill {
  fill: #F37D22 !important;
}
.line-custom-color--Arancio-1.circle-border {
  stroke: #F37D22 !important;
}

.line-container__svg .line-custom-color--Arancio-1 {
  stroke: #F37D22 !important;
}

#stGialla.line-custom-color--Arancio-1, #stBlu.line-custom-color--Arancio-1, #stVerde.line-custom-color--Arancio-1, #stArancione.line-custom-color--Arancio-1, #stViola.line-custom-color--Arancio-1 {
  stroke: #F37D22 !important;
}

.line-custom-color--Viola-1.line-title {
  color: #a44699 !important;
  border-top-color: #a44699 !important;
}
.line-custom-color--Viola-1.selezionato_path {
  border: solid 5px #a44699 !important;
}
.line-custom-color--Viola-1.st1, .line-custom-color--Viola-1.circle-fill {
  fill: #a44699 !important;
}
.line-custom-color--Viola-1.circle-border {
  stroke: #a44699 !important;
}

.line-container__svg .line-custom-color--Viola-1 {
  stroke: #a44699 !important;
}

#stGialla.line-custom-color--Viola-1, #stBlu.line-custom-color--Viola-1, #stVerde.line-custom-color--Viola-1, #stArancione.line-custom-color--Viola-1, #stViola.line-custom-color--Viola-1 {
  stroke: #a44699 !important;
}

.line-custom-color--Viola-2.line-title {
  color: #A44699 !important;
  border-top-color: #A44699 !important;
}
.line-custom-color--Viola-2.selezionato_path {
  border: solid 5px #A44699 !important;
}
.line-custom-color--Viola-2.st1, .line-custom-color--Viola-2.circle-fill {
  fill: #A44699 !important;
}
.line-custom-color--Viola-2.circle-border {
  stroke: #A44699 !important;
}

.line-container__svg .line-custom-color--Viola-2 {
  stroke: #A44699 !important;
}

#stGialla.line-custom-color--Viola-2, #stBlu.line-custom-color--Viola-2, #stVerde.line-custom-color--Viola-2, #stArancione.line-custom-color--Viola-2, #stViola.line-custom-color--Viola-2 {
  stroke: #A44699 !important;
}

.line-custom-color--Rosso-1.line-title {
  color: #993B2E !important;
  border-top-color: #993B2E !important;
}
.line-custom-color--Rosso-1.selezionato_path {
  border: solid 5px #993B2E !important;
}
.line-custom-color--Rosso-1.st1, .line-custom-color--Rosso-1.circle-fill {
  fill: #993B2E !important;
}
.line-custom-color--Rosso-1.circle-border {
  stroke: #993B2E !important;
}

.line-container__svg .line-custom-color--Rosso-1 {
  stroke: #993B2E !important;
}

#stGialla.line-custom-color--Rosso-1, #stBlu.line-custom-color--Rosso-1, #stVerde.line-custom-color--Rosso-1, #stArancione.line-custom-color--Rosso-1, #stViola.line-custom-color--Rosso-1 {
  stroke: #993B2E !important;
}

.line-custom-color--Rosso-2.line-title {
  color: #DB212F !important;
  border-top-color: #DB212F !important;
}
.line-custom-color--Rosso-2.selezionato_path {
  border: solid 5px #DB212F !important;
}
.line-custom-color--Rosso-2.st1, .line-custom-color--Rosso-2.circle-fill {
  fill: #DB212F !important;
}
.line-custom-color--Rosso-2.circle-border {
  stroke: #DB212F !important;
}

.line-container__svg .line-custom-color--Rosso-2 {
  stroke: #DB212F !important;
}

#stGialla.line-custom-color--Rosso-2, #stBlu.line-custom-color--Rosso-2, #stVerde.line-custom-color--Rosso-2, #stArancione.line-custom-color--Rosso-2, #stViola.line-custom-color--Rosso-2 {
  stroke: #DB212F !important;
}

.line-custom-color--Rosso-3.line-title {
  color: #C16154 !important;
  border-top-color: #C16154 !important;
}
.line-custom-color--Rosso-3.selezionato_path {
  border: solid 5px #C16154 !important;
}
.line-custom-color--Rosso-3.st1, .line-custom-color--Rosso-3.circle-fill {
  fill: #C16154 !important;
}
.line-custom-color--Rosso-3.circle-border {
  stroke: #C16154 !important;
}

.line-container__svg .line-custom-color--Rosso-3 {
  stroke: #C16154 !important;
}

#stGialla.line-custom-color--Rosso-3, #stBlu.line-custom-color--Rosso-3, #stVerde.line-custom-color--Rosso-3, #stArancione.line-custom-color--Rosso-3, #stViola.line-custom-color--Rosso-3 {
  stroke: #C16154 !important;
}

.line-custom-color--Rosa-1.line-title {
  color: #F7BFE2 !important;
  border-top-color: #F7BFE2 !important;
}
.line-custom-color--Rosa-1.selezionato_path {
  border: solid 5px #F7BFE2 !important;
}
.line-custom-color--Rosa-1.st1, .line-custom-color--Rosa-1.circle-fill {
  fill: #F7BFE2 !important;
}
.line-custom-color--Rosa-1.circle-border {
  stroke: #F7BFE2 !important;
}

.line-container__svg .line-custom-color--Rosa-1 {
  stroke: #F7BFE2 !important;
}

#stGialla.line-custom-color--Rosa-1, #stBlu.line-custom-color--Rosa-1, #stVerde.line-custom-color--Rosa-1, #stArancione.line-custom-color--Rosa-1, #stViola.line-custom-color--Rosa-1 {
  stroke: #F7BFE2 !important;
}

.line-custom-color--Rosa-2.line-title {
  color: #E88679 !important;
  border-top-color: #E88679 !important;
}
.line-custom-color--Rosa-2.selezionato_path {
  border: solid 5px #E88679 !important;
}
.line-custom-color--Rosa-2.st1, .line-custom-color--Rosa-2.circle-fill {
  fill: #E88679 !important;
}
.line-custom-color--Rosa-2.circle-border {
  stroke: #E88679 !important;
}

.line-container__svg .line-custom-color--Rosa-2 {
  stroke: #E88679 !important;
}

#stGialla.line-custom-color--Rosa-2, #stBlu.line-custom-color--Rosa-2, #stVerde.line-custom-color--Rosa-2, #stArancione.line-custom-color--Rosa-2, #stViola.line-custom-color--Rosa-2 {
  stroke: #E88679 !important;
}

.line-custom-color--Grigio-1.line-title {
  color: #262626 !important;
  border-top-color: #262626 !important;
}
.line-custom-color--Grigio-1.selezionato_path {
  border: solid 5px #262626 !important;
}
.line-custom-color--Grigio-1.st1, .line-custom-color--Grigio-1.circle-fill {
  fill: #262626 !important;
}
.line-custom-color--Grigio-1.circle-border {
  stroke: #262626 !important;
}

.line-container__svg .line-custom-color--Grigio-1 {
  stroke: #262626 !important;
}

#stGialla.line-custom-color--Grigio-1, #stBlu.line-custom-color--Grigio-1, #stVerde.line-custom-color--Grigio-1, #stArancione.line-custom-color--Grigio-1, #stViola.line-custom-color--Grigio-1 {
  stroke: #262626 !important;
}

.line-custom-color--Grigio-2.line-title {
  color: #535353 !important;
  border-top-color: #535353 !important;
}
.line-custom-color--Grigio-2.selezionato_path {
  border: solid 5px #535353 !important;
}
.line-custom-color--Grigio-2.st1, .line-custom-color--Grigio-2.circle-fill {
  fill: #535353 !important;
}
.line-custom-color--Grigio-2.circle-border {
  stroke: #535353 !important;
}

.line-container__svg .line-custom-color--Grigio-2 {
  stroke: #535353 !important;
}

#stGialla.line-custom-color--Grigio-2, #stBlu.line-custom-color--Grigio-2, #stVerde.line-custom-color--Grigio-2, #stArancione.line-custom-color--Grigio-2, #stViola.line-custom-color--Grigio-2 {
  stroke: #535353 !important;
}

.line-custom-color--Grigio-3.line-title {
  color: #808080 !important;
  border-top-color: #808080 !important;
}
.line-custom-color--Grigio-3.selezionato_path {
  border: solid 5px #808080 !important;
}
.line-custom-color--Grigio-3.st1, .line-custom-color--Grigio-3.circle-fill {
  fill: #808080 !important;
}
.line-custom-color--Grigio-3.circle-border {
  stroke: #808080 !important;
}

.line-container__svg .line-custom-color--Grigio-3 {
  stroke: #808080 !important;
}

#stGialla.line-custom-color--Grigio-3, #stBlu.line-custom-color--Grigio-3, #stVerde.line-custom-color--Grigio-3, #stArancione.line-custom-color--Grigio-3, #stViola.line-custom-color--Grigio-3 {
  stroke: #808080 !important;
}

.line-custom-color--Grigio-4.line-title {
  color: #ACACAC !important;
  border-top-color: #ACACAC !important;
}
.line-custom-color--Grigio-4.selezionato_path {
  border: solid 5px #ACACAC !important;
}
.line-custom-color--Grigio-4.st1, .line-custom-color--Grigio-4.circle-fill {
  fill: #ACACAC !important;
}
.line-custom-color--Grigio-4.circle-border {
  stroke: #ACACAC !important;
}

.line-container__svg .line-custom-color--Grigio-4 {
  stroke: #ACACAC !important;
}

#stGialla.line-custom-color--Grigio-4, #stBlu.line-custom-color--Grigio-4, #stVerde.line-custom-color--Grigio-4, #stArancione.line-custom-color--Grigio-4, #stViola.line-custom-color--Grigio-4 {
  stroke: #ACACAC !important;
}

.line-custom-color--Grigio-5.line-title {
  color: #D9D9D9 !important;
  border-top-color: #D9D9D9 !important;
}
.line-custom-color--Grigio-5.selezionato_path {
  border: solid 5px #D9D9D9 !important;
}
.line-custom-color--Grigio-5.st1, .line-custom-color--Grigio-5.circle-fill {
  fill: #D9D9D9 !important;
}
.line-custom-color--Grigio-5.circle-border {
  stroke: #D9D9D9 !important;
}

.line-container__svg .line-custom-color--Grigio-5 {
  stroke: #D9D9D9 !important;
}

#stGialla.line-custom-color--Grigio-5, #stBlu.line-custom-color--Grigio-5, #stVerde.line-custom-color--Grigio-5, #stArancione.line-custom-color--Grigio-5, #stViola.line-custom-color--Grigio-5 {
  stroke: #D9D9D9 !important;
}

.vueperslide__content-wrapper{
	width:100%;
}

@media screen and (max-width:768px){
	.vueperslide__content{
		transform: translateY(-20px);
	}
}



.vueperslide__content-wrapper {
  width: 100%;
	height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.showTooltip:not(#hub){
	position:relative;
}

@media screen and (min-width:1024px) {
  .showTooltip:hover .toolTip {
    display: block;
  }
}

.toolTip {
  display: none;
  position: absolute;
  
  z-index: 999999999999;
  background: linear-gradient(45deg, rgba(21, 69, 117, 0.9) 0%, rgba(31, 112, 178, 0.9) 100%);
  color: white;
  padding: 3px;
  text-align: center;
  white-space: nowrap;
	bottom: 0;
	left: 50%;
	transform: translate(-50%,100%);
}

.toolTip-ascom{
	transform: translate(-40%,100%);
}
/* 
.toolTipPercorso {
  transform: translateX(-22px);
} */

.map-title-container{
	display:flex;
	justify-content: center;
	
}

.map-title-container h3{
	font-size: 16px;
	padding-top: 8px;
}

.referent__back-button{
	display: flex;
	margin-bottom: 20px;
}

.subservice-name{
	max-width: calc(100% - 40px);
}

.footer-accordion-container{
	padding-right: 3px;
}

.altezzamassima .service-list-wrapper{
	min-height:100vh;
}

@media screen and (max-width:1024px){
	.altezzamassima .service-list-wrapper{
		padding-top: 100px;
	}
}

.path-buttons-container{
	display: flex;
	justify-content: space-between;
	padding:0 !important;
	
}

.path-buttons-container button{
	border-radius: 0;
	width: 50%;
	padding:17px 0;
	font-size: 1rem;
	position: relative;
}
.path-buttons-container button:first-child:after{
	content:'';
	position: absolute;
	height: 30px;
	width: 2px;
	background:white;
	right:0;
	top: 10px;
}

@media screen and (max-width:1024px){
	.line-blu-separator.service-list-wrapper{
		border-bottom:none !important;
	}

	#ui-button-selected.altezzamassima{
		padding-top:0px !important;
		top:0px;
	}
}

.path__service-name{
	font-size:14px;
	position: relative;
	top: 3px;
}

.path__subservice-name{
	font-size:12px;
}



@media screen and (max-width:1024px){
	.service-scroll-wrapper{
		overflow-y:scroll;
	}
}

@media screen and (pointer:coarse){
	.service-scroll-wrapper{
		overflow-y:scroll;
	}
}

@media screen and (max-width:1023px){

	#map-container{
		position:fixed;
	}

	#ui-button-selected{
		background:none;
		padding-top:0;
		min-height:auto;
	}

	.service-list-wrapper{
		overflow-y:scroll;
		background:rgba(250, 250, 250, 0.95);
	}
}

.container-canvas--no-tutorial{z-index:1}

#ilPercorso{padding-bottom:100px} 

.logo{
	pointer-events: none;
}



.custom-checkbox label:before{
	content:'';
	border-radius: 50%;
	border: solid 3px transparent;
	width: 18px;
	height: 18px;
	display: block;
	position: absolute;
	top: 11px;
	left: 11px;
}

.custom-checkbox input:checked + label:before{
	content:none;
}

.custom-checkbox.line-custom-color--Blu-1 label:before{border-color:#0E4799;}
.custom-checkbox.line-custom-color--Blu-2 label:before{border-color:#3290B4;}
.custom-checkbox.line-custom-color--Blu-3 label:before{border-color:#56D8CF;}
.custom-checkbox.line-custom-color--Verde-1 label:before{border-color:#00665E;}
.custom-checkbox.line-custom-color--Verde-2 label:before{border-color:#11A511;}
.custom-checkbox.line-custom-color--Verde-3 label:before{border-color:#D1D841;}
.custom-checkbox.line-custom-color--Giallo-1 label:before{border-color:#F6BC27;}
.custom-checkbox.line-custom-color--Arancio-1 label:before{border-color:#F37D22;}
.custom-checkbox.line-custom-color--Viola-1 label:before{border-color:#6D1650;}
.custom-checkbox.line-custom-color--Viola-2 label:before{border-color:#A44699;}
.custom-checkbox.line-custom-color--Rosso-1 label:before{border-color:#993B2E;}
.custom-checkbox.line-custom-color--Rosso-2 label:before{border-color:#DB212F;}
.custom-checkbox.line-custom-color--Rosso-3 label:before{border-color:#C16154;}
.custom-checkbox.line-custom-color--Rosa-1 label:before{border-color:#F7BFE2;}
.custom-checkbox.line-custom-color--Rosa-2 label:before{border-color:#E88679;}
.custom-checkbox.line-custom-color--Grigio-1 label:before{border-color:#262626;}
.custom-checkbox.line-custom-color--Grigio-2 label:before{border-color:#535353;}
.custom-checkbox.line-custom-color--Grigio-3 label:before{border-color:#808080;}
.custom-checkbox.line-custom-color--Grigio-4 label:before{border-color:#ACACAC;}
.custom-checkbox.line-custom-color--Grigio-5 label:before{border-color:#D9D9D9;}

.referent__image{
	display: block;
    max-width: 100%;
    height: auto;
}

.referent__contact-icon{
	width:100%;
}

.footer-logo{
	margin:20px 0;
}