body {position: relative; width: 990px; margin:auto; height:600px; position:relative;}
body *{outline: transparent !important; font-family: Arial, sans-serif !important; font-style:normal !important; font-weight:400; color:  #505050; font-size:14px; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-touch-callout:none;}	
body *::-moz-focus-inner {border: 0 !important;}



/* CLASES GENERALES */
.dip{display:inline-block;}
.cb{clear:both;}
.fl{float:left;}
.fr{float:right;}
.mancho{width:49%;}
.sinbr{border-right:0px !important;}
.sinmr{margin-right:0px !important;}
.oculto{display:none !important;}
.difuminado{opacity:0.7 !important;}
.psusp{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.pr{position:relative;}

span.color_p, span.txt_p{display:inline-block;height:13px;float:left;}
span.seats_p{display:inline-block;height:15px;float:right;}
span.color_p{width:6px; margin-right:5px;}

span.txt_p{margin-right:25px;}

span.color_p.color_p_big, span.txt_p.txt_p_big, span.porc_p.porc_p_big{height:28px; font-size:27px;}
span.txt_p.txt_p_big{margin-right:0px;}
span.color_p.color_p_big{margin-right:10px;}



#container{
	width:990px;
	margin:5px auto;
	height:500px;
	background-color:white;
	font-size:15px;
	color:#1a1a1a;
	position:relative;
	opacity:0;
}

/* LOADING*/
#pre{position:absolute; width:100%; top:150px; text-align:center;}

#dataviz{width:100%; height:550px; position:relative;}

#map_container{ width:62%; }


/* TOTALES */

#totales{ width:100%; height:56px;  }
#totales .total_container{ width:49%; text-align:center; padding-top:18px;}
#totales p{ font-size: 14px; }
#totales p .total{ 
	font-size: 27px;
	color:#4a778a;
}


/* MAPA */

#mapa_spain{width:100%; height:475px; position:relative;}

#mapa_spain .caja_gradiente {
	position: absolute;
	top:  455px; 
	left: 10px;
	z-index:99999;
}
#mapa_spain  .gradiente{
	width: 100px;
	height: 10px;  
	border: 1px solid #ddd;
	border-radius: 1px;
	margin:0px 5px;  
	float: left;
	background: -moz-linear-gradient(left, rgba(243,243,243,1) 0%, rgba(74,119,138,1) 100%);
	background: -webkit-gradient(left top, right top, color-stop(0%, rgba(243,243,243,1)), color-stop(100%, rgba(74,119,138,1)));
	background: -webkit-linear-gradient(left, rgba(243,243,243,1) 0%, rgba(74,119,138,1) 100%);
	background: -o-linear-gradient(left, rgba(243,243,243,1) 0%, rgba(74,119,138,1) 100%);
	background: -ms-linear-gradient(left, rgba(243,243,243,1) 0%, rgba(74,119,138,1) 100%);
	background: linear-gradient(to right, rgba(243,243,243,1) 0%, rgba(74,119,138,1) 100%);
}
#mapa_spain  .gradiente_txt{ float: left; font-size: 12px;}
#mapa_spain  .gradiente_titulo span{ font-size: 12px; position: absolute; top:  -20px; }

#negrita{  	font-weight:bold; color:#4a778a;}

#mapa_spain svg{display:block; margin:auto; width:600px; height:485px; }
#mapa_spain svg .caPath{
	cursor:pointer;
	stroke-width:1.2px;
	-webkit-transition: fill 200ms linear; -moz-transition: fill 200ms linear;
	-o-transition: fill 200ms linear; -ms-transition: fill 200ms linear; transition: fill 200ms linear;
}

#mapa_spain svg .caPath.sinDatos{
	cursor:default;
	pointer-events: none;
}

#dataviz:not(.mobile) #mapa_spain svg  .caPath.caSel{ fill:#DB544D; }

#tooltip {
	position: absolute;
	min-height: 40px;
	min-width: 90px;
	border: 1px solid #D3D3D3;
	display: none;
	z-index: 10000000;
	background-color: rgba(250, 250, 250, 0.85);
	padding: 5px;
	border-radius:4px;
}

#tooltip p {
	font-size: 13px;
	padding: 3px 6px;
	max-width:240px;
	margin-top: 0px;
	margin-bottom: 0px;
}

#tooltip p.nomProv{
	font-weight:700;

}

#mala_sombrica{float:left; width:10px; height:100%;}
#mala_sombrica img{height:100%;}


#ficha_pre{ 
	position:absolute; 
	width: 32%; 
	right:3%; 
	top:0px; 
	padding:16px; 
	padding-top:70px; 
	text-align:center; 
	z-index:1000; 
}
#ficha_pre p{ display:block; text-align:center; margin-top:25px; font-size:16px; line-height:25px; }
#ficha_pre_mob{ display:none;}
#ficha_pre strong, #ficha_pre_mob strong{ font-weight:bold; color:#4a778a; font-size:16px;}


/*****************************

	FICHA CONTAINER
	
*****************************/


#ficha{
	display: block;
	position:absolute;
	right:3%;
	top:10px;
	width:32%; 
	padding:16px;
    max-height: 455px;
	border:1px solid #4a778a;
	border-radius:5px;
	background-color:#fff;
	-webkit-box-shadow: 5px 5px 7px 0px rgba(153,153,153,0.57);
	-moz-box-shadow: 5px 5px 7px 0px rgba(153,153,153,0.57);
	box-shadow: 5px 5px 7px 0px rgba(153,153,153,0.57);
	z-index:10000;
}

#ficha_cabecera{height:27px;}
#ficha_cabecera div.buttClose{ 
	float:right;
	cursor:pointer; 
	background-color:#4a778a;
	color:#fff;
	padding:5px;
	padding-left:8px;
	border-radius:3px; 
	-webkit-transition: all 200ms linear; -moz-transition: all 200ms linear;
	-o-transition: all 200ms linear; -ms-transition: all 200ms linear; transition: all 200ms linear;
} 
#ficha_cabecera div.buttClose:hover{ background-color:rgba(82,102,120,0.55); } 

#ficha_cabecera div.buttClose span.txt_p{margin-right:6px; font-size:13px; line-height:1.1; color:#fff;}
#ficha_cabecera div.buttClose span.closeCont{ display:inline-block; float:left;width:13px; height:13px; }
#ficha_cabecera div.buttClose span.closeCont svg{width:13px; height:13px;}

#ficha p, #ficha span, #ficha button, #ficha a, #ficha strong{font-size:15px;}
#ficha p{text-align:left; padding-top:10px; padding-bottom:10px; line-height:1.5;}
#ficha strong{font-weight:bold;}
#ficha span:not(.txt_p):not(.closeCont){height:23px;}
#ficha .fcont{ clear:both; width:100%; min-height:30px; padding-bottom:5px;}
#ficha .fcont h2{ font-weight:bold; font-size:15px; color:#4a778a; margin-bottom:10px;}
#ficha .fleft{ float:left; width:40%; text-align:left; }
#ficha .fright{ float:right; width:59%;  text-align:left;}
#ficha .fall{ clear:both; width:100%;  text-align:left; margin: 5px 0px;}

#ficha .ficha_linea{clear:both; width:100%; min-height:30px;}
#ficha .ficha_linea .dip{ text-align:left; }

.label_ficha{ color: #505050; }
.value_ficha{ /*color: #4a778a;*/ color: #505050; }

#ficha #ficha_nombre span, #ficha #ficha_nom_ca span{text-transform:uppercase; font-weight:bold; }

#ficha_totalca{ padding-bottom: 5px !important;  }
#ficha_totalca .fall{ margin-top: 0px; }
#ficha_totalca_cat{ text-transform:lowercase; }
#ficha_totalca_porc_nac_mob{ display:none;}

#ficha_masrico h2{ margin-bottom:18px; }
#ficha_masrico .fall{ margin:5px 0px !important;}
#ficha_masrico .fall#ficha_masrico_nombre{ margin: 10px 0px !important; }
#ficha_masrico #ficha_masrico_nombre span.value_ficha{ font-weight:bold; color:#4a778a;}
#ficha_masrico .fall:not(#ficha_masrico_nombre) span.value_ficha{ display:inline-block; height:auto!important; position:relative; left:20px; line-height:20px; margin-right:20px; }
#ficha_masrico .fall:not(#ficha_masrico_nombre) span.value_ficha:before{
	position:absolute;
	width:4px; 
	height:4px; 
	content: ''; 
	top:6px; 
	left:-12px; 
	border-radius:50%; 
	background-color:#4a778a; 
	position:absolute;
}

.radial-progress {
    margin: 0px;
    width: 94px;
    height: 94px;
    background-color:#fff;
    border-radius: 50%;
}
.mask, .fill {
	width: 94px;
	height: 94px;
	position: absolute;
	border-radius: 50%;
}

.mask, .fill {
	/*-webkit-backface-visibility: hidden;*/
	transition: -webkit-transform 300ms; transition: -ms-transform 300ms; transition: transform 300ms;
	-webkit-transition: -webkit-transform 300ms; -webkit-transition: -ms-transform 300ms; -webkit-transition: transform 300ms;
	-moz-transition: -webkit-transform 300ms; -moz-transition: -ms-transform 300ms; -moz-transition: transform 300ms;
	-o-transition: -webkit-transform 300ms; -o-transition: -ms-transform 300ms; -o-transition: transform 300ms;
	-ms-transition: -webkit-transform 300ms; -ms-transition: -ms-transform 300ms; -ms-transition: transform 300ms;
}
.mask {
	clip: rect(0px, 94px, 94px, 47px);
}

.mask .fill {
	clip: rect(0px, 47px, 94px, 0px);
	background-color: #4a778a;
}
.inset {
	position: absolute;
	border: 1px solid rgba(74,119,138,0.4);
	
	width: 80px;
	height: 80px;
	margin-left: 6px;
	margin-top: 6px;
	
	background-color: #fff;
	border-radius: 50%;
	/*box-shadow: 6px 6px 10px rgba(0, 0, 0, 0.2);*/
}

#ficha .donut{ position:relative; float:left; width:34%; height:95px; }
#ficha .donut_txt{ float:left; width:56%; margin-top:20px;}
#ficha .donut_txt p{ text-align:center; padding-top:2px; padding-bottom:2px; line-height:1.5;}

#ficha .donut svg{ display:block;  /*margin:auto;*/ }
#ficha .donut .porc_donut{ 
	position:absolute; 
	left:0px;
	top:0px;
	width:80px; 
	text-align:center; 
}
#ficha .donut .porc_donut span{ font-size:16px; line-height:80px;}

#ficha #ficha_enlace{ min-height:23px; margin-top:10px; padding-bottom:0px;}
#ficha_enlace_noticia{width:100%; text-align:Center;}
#ficha_enlace_noticia a{
	display:block; 
	width:100%;
	background-color:#4a778a;
	color:#fff;
	padding:5px 0px;
	border-radius:3px;
	font-size:14px; 
	line-height:1.1;	
	-webkit-transition: all 200ms linear; -moz-transition: all 200ms linear;
	-o-transition: all 200ms linear; -ms-transition: all 200ms linear; transition: all 200ms linear;
}
#ficha_enlace_noticia a span#com_enlace{ font-size:14px; line-height:1.1; color:#fff; }
#ficha_enlace_noticia a:hover{ background-color:rgba(82,102,120,0.55); } 


::-webkit-scrollbar{
	width:6px;
}

::-webkit-scrollbar-track {
	background:lightgrey;
}
 
::-webkit-scrollbar-thumb {
	background:  #4a778a; 
}

#selector_container{display:none;}

@media screen and (min-width: 990px) {
	#ficha_pre_mob{ display:none !important; }
}

@media screen and (max-width: 989px) {
	
	body { width: 310px; height:350px; }
	#pre{ top:70px; }
	#container{ position:relative; width:310px; height:350px;}
	#dataviz{height:350px;}
	
	#selector_container{display:block; width:100%; height:40px; }
	.select{ display:block; width:200px; margin:auto;z-index: 9999999; }
	.select-options{ z-index:1000000; max-height:207px; overflow-y:auto;}
	.select-options li{ color:#505050 !important; background-color:#fff !important;}
	.select-styled{ z-index:1000000; }
	
	#map_container{ position:relative; width:100%; margin:auto; z-index:1000;}
	#mapa_spain{ height:350px; }
	#mapa_spain svg{ width:310px; height:250px; }
	#mapa_spain .caja_gradiente{ top:275px; }
	#mapa_spain  .gradiente_titulo span{ width:100%; left:-5px;}
	
	
	#ficha_pre{ display:none !important; }
	#ficha_pre_mob{ 
		position:absolute;
		display:block;
		width: 270px;
		height:310px;	
		left:0px; 
		top:0px; 
		padding:0px 20px;
		padding-top:40px;
		text-align:center; 
		z-index:10000000;
		background-color: rgba(255,255,255,0.9);
	}
	#ficha_pre_mob p{ display:block; width:95%; margin:auto; text-align:center; margin-top:15px; font-size:13px; line-height:20px; }
	#ficha_pre_mob button{
		background-color:#4a778a;
		color:#fff;
		padding:6px 10px;
		border:1px solid #4a778a;
		border-radius:3px;
		font-size:14px; 
		line-height:1.1;	
		margin-top:5px;
	}
	#ficha_pre_mob strong{ font-size:13px; }
		
	#ficha{position:absolute; width:88%; right:2px; top:36px; z-index: 10000; padding:14px; }
	
	
	#ficha_cabecera{ height:25px; padding-bottom:0px;}
	#ficha h1#ficha_nom_ca{ padding-top:5px;}
	#ficha .fcont{ min-height:25px; padding-bottom:2px;}
	#ficha .fall{margin:0px;}
	#ficha #donut_container{ display:none; }
	
	#ficha_totalca{ padding-bottom:0px !important;}
	#ficha_totalca_porc_nac_mob{ display:inline;}
	
	#ficha p{ line-height:1.4em; }
	#ficha_masrico h2{ margin-bottom: 0px !important; }
	#ficha_masrico .fall#ficha_masrico_nombre{ margin: 8px 0px !important; }
	#ficha_masrico .fall:not(#ficha_masrico_nombre) span.value_ficha{ line-height:1.5em; }
	#ficha #parrafo_info_ca *, #ficha #ficha_masrico *, #ficha_enlace_noticia *{font-size:13px !important;}
	
	#ficha #ficha_enlace{ margin-top:5px; }

}