/* FONTS */

@font-face{
	font-family:"PT Serif";
	src:url("https://e00-elmundo.uecdn.es/fonts/PTSerifWeb/pt_serif-web-regular-webfont.eot");
	src:url("https://e00-elmundo.uecdn.es/fonts/PTSerifWeb/pt_serif-web-regular-webfont.eot?#iefix") format("embedded-opentype"),url("https://e00-elmundo.uecdn.es/fonts/PTSerifWeb/pt_serif-web-regular-webfont.woff2") format("woff2"),url("https://e00-elmundo.uecdn.es/fonts/PTSerifWeb/pt_serif-web-regular-webfont.woff") format("woff"),url("https://e00-elmundo.uecdn.es/fonts/PTSerifWeb/pt_serif-web-regular-webfont.ttf") format("ttf")
}

@font-face{
	font-family:"PT Serif Bold";
	src:url("https://e00-elmundo.uecdn.es/fonts/PTSerifWeb/pt_serif-web-bold-webfont.eot");
	src:url("https://e00-elmundo.uecdn.es/fonts/PTSerifWeb/pt_serif-web-bold-webfont.eot?#iefix") format("embedded-opentype"),url("https://e00-elmundo.uecdn.es/fonts/PTSerifWeb/pt_serif-web-bold-webfont.woff2") format("woff2"),url("https://e00-elmundo.uecdn.es/fonts/PTSerifWeb/pt_serif-web-bold-webfont.woff") format("woff"),url("https://e00-elmundo.uecdn.es/fonts/PTSerifWeb/pt_serif-web-bold-webfont.ttf") format("ttf")
}

@font-face{
	font-family:"Clear Sans Bold";
	src:url("https://e00-elmundo.uecdn.es/fonts/clearWeb/ClearSans-Bold-webfont.eot");
	src:url("https://e00-elmundo.uecdn.es/fonts/clearWeb/ClearSans-Bold-webfont.eot?#iefix") format("embedded-opentype"),url("https://e00-elmundo.uecdn.es/fonts/clearWeb/ClearSans-Bold-webfont.woff2") format("woff2"),url("https://e00-elmundo.uecdn.es/fonts/clearWeb/ClearSans-Bold-webfont.woff") format("woff"),url("https://e00-elmundo.uecdn.es/fonts/clearWeb/ClearSans-Bold-webfont.ttf") format("ttf")
}

body {position: relative; max-width: 660px; margin:auto; height:630px;}
body *{
	outline: transparent !important;
	font-family: 'PT Serif', serif;
	font-style:normal !important;
	font-weight:400; color: #505050;
	font-size:14px;
}
body *::-moz-focus-inner {border: 0 !important;}


/* CLASES GENERALES */

.dip{display:inline-block;}
.cb{clear:both;}
.fl{float:left;}
.fr{float:right;}
.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;}


/* CABECERA Y CONTROLES */

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

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

.container-graphic {
  width: 100%;
  max-width: 660px;
  opacity:0;
  overflow: hidden;
  position:relative;
}

#titular{
	font-family: 'Clear Sans Bold', sans-serif;
	font-size:20px;
	color:#0C3048;
	height:25px;
	line-height:30px;
	margin-top:5px;
	margin-bottom:5px;
	padding-left:15px;
}

#subtitulo{
	font-size:14px;
	height:15px;
	line-height:15px;
	margin-top:10px;
	margin-bottom:15px;
	padding-left:15px;
}

.control_container{
	position:relative;
	z-index:10001;
	display:inline-block;
}

.control_container .control_title{
	position:relative;
	width:100%;
	height:18px;
	font-size:13px;
	text-align:left;
	margin-bottom:2px;
}


#bots_col_container{ padding-left:15px; }

#bots_col_container p{ display:inline-block; }

#bots_col_container button{
	margin-left: 15px;
	padding:5px 15px;
	border: 1px solid #1b8f65;
	color: #1b8f65;
	background-color:#fff;
	cursor:pointer;
	-webkit-transition: all 200ms linear; -moz-transition: all 200ms linear;
	-o-transition: all 200ms linear; -ms-transition: all 200ms linear; transition: all 200ms linear;
}

#bots_col_container button.activo{ color:#fff; background-color:#1b8f65; }

#bots_col_container #vista_col_1{ margin-left:0px; }

#filtro .select{ width:85% !important; }

#filtro_prods_container{
	float:right;
	padding-top:4px;
	padding-right:15px;
}

#filtro_prods_container .filtro_title, #filtro_prods_container .select{
	display:inline-block;
	float:left;
}

#filtro_prods_container .filtro_title{
	padding-top:4px;
	margin-right:10px;
}

#filtro_prods_container .select-options{
	overflow-y: auto;
	max-height: 170px;
}


/* SVG */

#evol-graphic{
	margin-top:15px;
	position:relative;
}

#svg-evol-graphic .line {
  fill: transparent !important;
  stroke-width: 1.5px;
  stroke: #000;
  -webkit-transition: opacity 200ms linear;
  -moz-transition: opacity 200ms linear;
  -o-transition: opacity 200ms linear;
  -ms-transition: opacity 200ms linear;
  transition: opacity 200ms linear;
}

#svg-evol-graphic .line.line-evol {
  opacity: 0;
}

#svg-evol-graphic .line.line-evol.line-evol-activo {
  opacity: 1;
}

#svg-evol-graphic .line.line-evol-0 {stroke: #696969;}
#svg-evol-graphic .line.line-evol-1 {stroke: #E6194B;}
#svg-evol-graphic .line.line-evol-2 {stroke: #3CB44B;}
#svg-evol-graphic .line.line-evol-3 {stroke: #FFE119;}
#svg-evol-graphic .line.line-evol-4 {stroke: #4363D8;}
#svg-evol-graphic .line.line-evol-5 {stroke: #F58231;}
#svg-evol-graphic .line.line-evol-6 {stroke: #911EB4;}
#svg-evol-graphic .line.line-evol-7 {stroke: #42D4F4;}
#svg-evol-graphic .line.line-evol-8 {stroke: #F032E6;}
#svg-evol-graphic .line.line-evol-9 {stroke: #BFEF45;}
#svg-evol-graphic .line.line-evol-10 {stroke: #FABEBE;}
#svg-evol-graphic .line.line-evol-11 {stroke: #469990;}
#svg-evol-graphic .line.line-evol-12 {stroke: #E6BEFF;}
#svg-evol-graphic .line.line-evol-13 {stroke: #a47239;}
#svg-evol-graphic .line.line-evol-14 {stroke: #e5e1b8;}
#svg-evol-graphic .line.line-evol-15 {stroke: #800000;}
#svg-evol-graphic .line.line-evol-16 {stroke: #AAFFC3;}
#svg-evol-graphic .line.line-evol-17 {stroke: #808000;}
#svg-evol-graphic .line.line-evol-18 {stroke: #FFD8B1;}
#svg-evol-graphic .line.line-evol-19 {stroke: #000075;}

#svg-evol-graphic .axis text {
  font-family: 'Roboto Slab Regular', sans-serif;
  fill: #1a1a1a;
  font-size: 12px;
}

#svg-evol-graphic .axis path {
  display: none;
}

#svg-evol-graphic .axis line {
  shape-rendering: crispEdges;
  stroke: lightgrey;
  opacity: 0.5;
}

#svg-evol-graphic .axis line.axisLine {
  opacity: 1;
  stroke: #1a1a1a;
}

#svg-evol-graphic .axis .tick line {
  opacity: 1;
  stroke: #1a1a1a;
}


#svg-evol-graphic  .circulo{
	opacity:0;
	pointer-events:none;
	-webkit-transition: opacity 200ms linear;
	-moz-transition: opacity 200ms linear;
	-o-transition: opacity 200ms linear;
	-ms-transition: opacity 200ms linear;
	transition: opacity 200ms linear;
}

#svg-evol-graphic  .circuloOn{
	pointer-events: all;
	/*cursor:pointer;*/
}

#svg-evol-graphic  .circuloOn.circuloHov{
	opacity:1;
}

#svg-evol-graphic  .circuloOn.circuloOnImp{
	opacity:1 !important;
}

#svg-evol-graphic  .circuloSinDatos {
	display:none !important;
	/*
	opacity:0;
	pointer-events:none;
	*/
	
}

#svg-evol-graphic .circulo.circulo-evol-0 {fill: #696969;}
#svg-evol-graphic .circulo.circulo-evol-1 {fill: #E6194B;}
#svg-evol-graphic .circulo.circulo-evol-2 {fill: #3CB44B;}
#svg-evol-graphic .circulo.circulo-evol-3 {fill: #FFE119;}
#svg-evol-graphic .circulo.circulo-evol-4 {fill: #4363D8;}
#svg-evol-graphic .circulo.circulo-evol-5 {fill: #F58231;}
#svg-evol-graphic .circulo.circulo-evol-6 {fill: #911EB4;}
#svg-evol-graphic .circulo.circulo-evol-7 {fill: #42D4F4;}
#svg-evol-graphic .circulo.circulo-evol-8 {fill: #F032E6;}
#svg-evol-graphic .circulo.circulo-evol-9 {fill: #BFEF45;}
#svg-evol-graphic .circulo.circulo-evol-10 {fill: #FABEBE;}
#svg-evol-graphic .circulo.circulo-evol-11 {fill: #469990;}
#svg-evol-graphic .circulo.circulo-evol-12 {fill: #E6BEFF;}
#svg-evol-graphic .circulo.circulo-evol-13 {fill: #a47239;}
#svg-evol-graphic .circulo.circulo-evol-14 {fill: #e5e1b8;}
#svg-evol-graphic .circulo.circulo-evol-15 {fill: #800000;}
#svg-evol-graphic .circulo.circulo-evol-16 {fill: #AAFFC3;}
#svg-evol-graphic .circulo.circulo-evol-17 {fill: #808000;}
#svg-evol-graphic .circulo.circulo-evol-18 {fill: #FFD8B1;}
#svg-evol-graphic .circulo.circulo-evol-19 {fill: #000075;}

#svg-evol-graphic  rect.vor_superf {
  cursor: pointer;
}

/* Tooltip de evolución */

#tooltip{
  position: absolute;
  width: 170px;
  z-index: 10000000;
  background-color: rgba(255, 255, 255, 0.95);
  color: #fff;
  bottom: 0px;
  border-radius: 5px;
  display: none;
  padding: 15px;
  border:1px solid #1b8f65;
  border-left: 6px solid #1b8f65;
}

#tooltip li{
	padding-top:5px;
}

#tooltip h3{
	font-size:15px;
	padding-bottom:5px;
}

#tooltip li span{
  font-size: 13px;
}

#tooltip li span.ttip-value{
	font-family: 'PT Serif Bold', serif;
}

#tooltip li span.ttip-lugar.con-color{
	position:relative;
	padding-left:15px;
}

#tooltip li span.ttip-lugar.con-color:before{
	content:'';
	position:absolute;
	left:0px;
	top:3px;
	width:10px;
	height:10px;
	border-radius:12px;
}

#tooltip li.ttip-0 .ttip-lugar.con-color:before{background-color: #696969;}
#tooltip li.ttip-1 .ttip-lugar.con-color:before{background-color: #E6194B;}
#tooltip li.ttip-2 .ttip-lugar.con-color:before{background-color: #3CB44B;}
#tooltip li.ttip-3 .ttip-lugar.con-color:before{background-color: #FFE119;}
#tooltip li.ttip-4 .ttip-lugar.con-color:before{background-color: #4363D8;}
#tooltip li.ttip-5 .ttip-lugar.con-color:before{background-color: #F58231;}
#tooltip li.ttip-6 .ttip-lugar.con-color:before{background-color: #911EB4;}
#tooltip li.ttip-7 .ttip-lugar.con-color:before{background-color: #42D4F4;}
#tooltip li.ttip-8 .ttip-lugar.con-color:before{background-color: #F032E6;}
#tooltip li.ttip-9 .ttip-lugar.con-color:before{background-color: #BFEF45;}
#tooltip li.ttip-10 .ttip-lugar.con-color:before{background-color: #FABEBE;}
#tooltip li.ttip-11 .ttip-lugar.con-color:before{background-color: #469990;}
#tooltip li.ttip-12 .ttip-lugar.con-color:before{background-color: #E6BEFF;}
#tooltip li.ttip-13 .ttip-lugar.con-color:before{background-color: #a47239;}
#tooltip li.ttip-14 .ttip-lugar.con-color:before{background-color: #e5e1b8;}
#tooltip li.ttip-15 .ttip-lugar.con-color:before{background-color: #800000;}
#tooltip li.ttip-16 .ttip-lugar.con-color:before{background-color: #AAFFC3;}
#tooltip li.ttip-17 .ttip-lugar.con-color:before{background-color: #808000;}
#tooltip li.ttip-18 .ttip-lugar.con-color:before{background-color: #FFD8B1;}
#tooltip li.ttip-19 .ttip-lugar.con-color:before{background-color: #000075;}


#evol-graphic .fuente{ margin-left:2%; }

#evol-graphic .fuente a{ color:#0C3048; text-decoration: underline; }


/* SELECTOR DE COMUNIDADES AUTÓNOMAS */

#evol-selector-parks {
  width: 100%;
  margin-top: 15px;
}

#evol-selector-parks ul {
  width: 100%;
}

#evol-selector-parks ul li {
  position: relative;
  display: inline-block;
  float:left;
  padding: 5px 0px;
  width: 22%;
  padding-left: 3%;
  font-family: 'Roboto Slab Regular', sans-serif;
}

#evol-selector-parks ul li span{ cursor:pointer; }

#evol-selector-parks ul li span.evol-name {
  position: relative;
  display: inline-block;
  padding: 5px;
  padding-right: 0px;
  z-index: 1000;
  font-size:13px;
}

#evol-selector-parks ul li span.evol-color {
  position: absolute;
  top: 8px;
  left: 3px;
  width: 15px;
  height: 15px;
  border-radius: 12px;
  color: #fff;
  z-index: 100;
}

#evol-selector-parks ul li span.evol-color i {
  color: #fff;
  padding-left:3px;
  font-size:12px;
  opacity: 0;
  font-weight:bold;
  padding-right:4px;
  -webkit-transition: opacity 200ms linear;
  -moz-transition: opacity 200ms linear;
  -o-transition: opacity 200ms linear;
  -ms-transition: opacity 200ms linear;
  transition: opacity 200ms linear;
}

#evol-selector-parks ul li.evol-activo span.evol-color i {
  opacity: 1;
}

#evol-selector-parks ul li.evol-0 span.evol-color {background-color: /*#000*/ #696969;}
#evol-selector-parks ul li.evol-1 span.evol-color {background-color: #E6194B;}
#evol-selector-parks ul li.evol-2 span.evol-color {background-color: #3CB44B;}
#evol-selector-parks ul li.evol-3 span.evol-color {background-color: #FFE119;}
#evol-selector-parks ul li.evol-4 span.evol-color {background-color: #4363D8;}
#evol-selector-parks ul li.evol-5 span.evol-color {background-color: #F58231;}
#evol-selector-parks ul li.evol-6 span.evol-color {background-color: #911EB4;}
#evol-selector-parks ul li.evol-7 span.evol-color {background-color: #42D4F4;}
#evol-selector-parks ul li.evol-8 span.evol-color {background-color: #F032E6;}
#evol-selector-parks ul li.evol-9 span.evol-color {background-color: #BFEF45;}
#evol-selector-parks ul li.evol-10 span.evol-color {background-color: #FABEBE;}
#evol-selector-parks ul li.evol-11 span.evol-color {background-color: #469990;}
#evol-selector-parks ul li.evol-12 span.evol-color {background-color: #E6BEFF;}
#evol-selector-parks ul li.evol-13 span.evol-color {background-color: #a47239;}
#evol-selector-parks ul li.evol-14 span.evol-color {background-color: #e5e1b8;}
#evol-selector-parks ul li.evol-15 span.evol-color {background-color: #800000;}
#evol-selector-parks ul li.evol-16 span.evol-color {background-color: #AAFFC3;}
#evol-selector-parks ul li.evol-17 span.evol-color {background-color: #808000;}
#evol-selector-parks ul li.evol-18 span.evol-color {background-color: #FFD8B1;}
#evol-selector-parks ul li.evol-19 span.evol-color {background-color: #000075;}


#evol-selector-parks ul #evol-select-0 {
  width: 90%;
}



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

	CUSTOM SELECT

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

.select-hidden {
  display: none;
  visibility: hidden;
  padding-right: 10px;
}

.select {
  cursor: pointer;
  display: inline-block;
  position: relative;
  color: #1b8f65;
  width: 143px;
  height: 25px;
}

.select-styled {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  color: #1b8f65;
  background-color: #fff;
  padding: 3px 6px;
  line-height:18px;
  border-bottom:1px solid #1b8f65;
  -moz-transition: all 0.2s ease-in;
  -o-transition: all 0.2s ease-in;
  -webkit-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in;
  font-size: 13px;
}
.select-styled:after {
  content: "";
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-color: #1b8f65 transparent transparent transparent;
  position: absolute;
  top: 9px;
  right: 6px;
}
.select-styled:hover {}
.select-styled:active, .select-styled.active {
  /*border-color:#7d196c;*/
  border-bottom-color:transparent;
  border-bottom-right-radius:0px;
  border-bottom-left-radius:0px;
}
.select-styled:active:after, .select-styled.active:after {
  top: 2px;
  border-color: transparent transparent /*#7d196c*/ #1b8f65 transparent;
}

.select-options {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  z-index: 999;
  margin: 0;
  padding: 0;
  list-style: none;
  /*border-bottom: 1px solid   #e6e6e6;*/
  border-right: 1px solid   #e6e6e6;
  border-left: 1px solid   #e6e6e6;
  border-bottom: 1px solid   #1b8f65;
  /*border-right: 1px solid   #1b8f65;*/
  /*border-left: 1px solid   #1b8f65;*/

  background-color:#fff;
}
.select-options li {
  font-size:13px;
  margin: 0;
  padding:10px 0px;
  text-indent: 6px;
  color: #1b8f65;
  border-top: 1px solid #e6e6e6;
  -moz-transition: all 0.15s ease-in;
  -o-transition: all 0.15s ease-in;
  -webkit-transition: all 0.15s ease-in;
  transition: all 0.15s ease-in;
}
.select-options li:hover {
  color: #fff;
  background: #1b8f65;
}
.select-options li[rel="hide"] {
  display: none;
}

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

::-webkit-scrollbar-track {
	background:lightgrey;
}

::-webkit-scrollbar-thumb {
	background: #1b8f65;
}



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

	#titular{font-size:18px;}

	/*
	#container{ width:300px; height:435px;}
	.control_container{ float:right; right:auto; margin-top:2px; width:90%; right:5%; height:40px; text-align:center;}
	*/

	#filtro_container, #filtro_container *{ z-index:10000000; }
	#filtro_title{ display:none; }

	/*
	.select-styled{ padding:0px 6px; }
	#bots_col_container{ top:15px; width:90%; text-align:center; }
	#bots_col_container button{ padding: 5px 25px; margin-right:10px; margin-left:10px;}
	*/

	#evol-selector-parks ul li { width: 28%; padding-left: 5%; }

}

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

	#evol-selector-parks ul li { width: 27%; padding-left: 6%; }

}

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

	#evol-selector-parks ul li { width: 26%; padding-left: 7%; }
	#svg-evol-graphic .line { stroke-width: 1px; }
	#svg-evol-graphic .axis text { font-size: 10px; }

}

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

	#evol-selector-parks ul li { width: 27%; padding-left: 6%; }
	#evol-selector-parks ul li span.evol-color{ width:12px; height:12px; top:10px; }
	#evol-selector-parks ul li span.evol-color i { position:absolute; left:-1px; top:1px; font-size:11px; font-weight:bold; }

}