/* html, body and map stlyes */
	
	html, body, #map {
				width: 100%;
				height: 100%;
				padding: 0;
				margin: 0;
				overflow: hidden;
				border: 0px;
				}
				
	/* Carrega tesseles efecte */
	.leaflet-tile{ 
	  filter:blur(10px);
	  opacity: 0;
	  transform: rotate( 0deg ) scale(0);
	}
	.leaflet-tile.leaflet-tile-loaded{
	  filter:blur(0);
	  opacity: 0.7;
	  transform: rotate( 360deg ) scale(1);
	  transition:.6s all ease-in;
	}

	.leaflet-tile {
		outline: 0.1px solid transparent;
	}

	  a{
		color: #049191;
	  }

	  .padding{
		height: 6px;
		display: block;
	  }


	  .rotate{
		-moz-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		-o-transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	  }




	  .padding{
		height: 6px;
		display: block;
	  }
		
		
		/* ESTILS DEL SELECTOR D'OPACITAT */
		
		/*input range styles (slider thumb)*/
						
		input[type=range] {
		  -webkit-appearance: none; /* Hides the slider so that custom slider can be made */
		  width: 120px; /* Specific width is required for Firefox. */
		  background: transparent; /* Otherwise white in Chrome */
		}

		input[type=range]::-webkit-slider-thumb {
		  -webkit-appearance: none;
		}

		input[type=range]:focus {
		  outline: none; /* Removes the blue border. You should probably do some kind of focus styling for accessibility reasons though. */
		}

		input[type=range]::-ms-track {
		  width: 100%;
		  cursor: pointer;

		  /* Hides the slider so custom styles can be added */
		  background: transparent; 
		  border-color: transparent;
		  color: transparent;
		}
				

	
		input[type=range]::-moz-range-track {
			
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0.65+100 */
		background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=1 ); /* IE6-9 */
			height: 6px;
			width: 120px;
			}
		
		/* Special styling for WebKit/Blink */
		input[type=range]::-webkit-slider-thumb {
		  -webkit-appearance: none;
		  border: 1px solid #000000;
		  height: 16px;
		  width: 8px;
		  border-radius: 3px;
		  background: #ffffff;
		  cursor: pointer;
		  margin-top: -5px; /* You need to specify a margin in Chrome, but in Firefox and IE it is automatic */
		  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d; /* Add cool effects to your sliders! */
		}

		/* All the same stuff for Firefox */
		input[type=range]::-moz-range-thumb {
		  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
		  border: 1px solid #000000;
		  height: 16px;
		  width: 8px;
		  border-radius: 3px;
		  background: #ffffff;
		  cursor: pointer;
		}

		/* All the same stuff for IE */
		input[type=range]::-ms-thumb {
		  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
		  border: 1px solid #000000;
		  height: 36px;
		  width: 16px;
		  border-radius: 3px;
		  background: #ffffff;
		  cursor: pointer;
		}
		
		input[type=range]::-webkit-slider-runnable-track {
			width: 120px;
			height: 5px;
			background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* Chrome10-25,Safari5.1-6 */
			background: linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
			border: none;
			border-radius: 3px;
		}


/* GRAFIC SCALE */ 
		.leaflet-control-graphicscale {
			/*background-color: rgb(255, 255, 255);*/
			padding: 0px 50px 0px 10px;
			/*box-shadow: 0px 0px 30px rgba(52, 38, 13, .8);*/
			color: rgb(0, 0, 0);
			border-radius: 4px;

			/* border: 1px solid white; */
			}
			
		.leaflet-control-graphicscale .label {
			font-family: 'Barlow Condensed', sans-serif;
			text-shadow: 0 0 2px white, 0 0 2px white, 0 0 2px white, 0 0 2px white, 0 0 2px white;
			font-weight: normal;
			font-size: 11.0px;
			margin-bottom: 2px;
			color: black;
			maxWidth: 200;
		}
		.leaflet-control-graphicscale-inner .division .line {
			background-color: rgba(255, 255, 255, 0.8);
		}
			
		.leaflet-control-graphicscale-inner.double .subunits .division .line2 {
			background-color: rgba(255, 255, 255, 0.8);
		}
		
		.leaflet-control-graphicscale-inner.double .division .line2 {
			background-color: rgba(255, 255, 255, 0.8);
		}
			
		.leaflet-control-graphicscale .labelSub {
			font-size: 9px;
			margin-bottom: 4px;
		}

		.leaflet-control-graphicscale .line {
			border-color: rgb(0, 0, 0);
		}

		.leaflet-control-graphicscale .filled .fill {
			background-color: rgb(0, 0, 0);
		}

		.scaleText {
			margin-bottom: 35px;
			text-align: center;
		}

		.scaleText h1, .scaleText p {
			margin: 0;
		}

		.scaleText h1 {
			font-family: 'Barlow Condensed', sans-serif;
			font-size: 30px;
		}

		.scaleText .choice {
			margin: 0 5px;
			cursor: pointer;
		}

		.leaflet-control-mapcentercoord-icon {
		  background: url(icons/MapCenterCoordIcon1.svg) 50% 50% no-repeat;
		}
		
		
	/* SWITCHSCALE */ 
	/*	.leaflet-container {
			font-family: 'Barlow Condensed', sans-serif;
	/*	}