* {

  font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";

  font-size: 14px;

  /*color: #fff;*/

}





#chartdiv {

  width: 100%;

  height: 600px;

}



.fondo{

	background-color: #fff;

	fill:#000;

}



body{

	margin: 0px;

	padding: 0px;

}



#app_container {

  width: 100%;

  min-height: 100vh;

  /*background: #336699;

  background: -webkit-linear-gradient(45deg, #336699, rgba(33,66,99,1));

  background: -o-linear-gradient(45deg, #336699, rgba(33,66,99,1));

  background: -moz-linear-gradient(45deg, #336699, rgba(33,66,99,1));

  background: linear-gradient(45deg, #336699, rgba(33,66,99,1));*/



  align-items: center;

  justify-content: center;

  padding: 0px;

	margin: 0px;

}



table#resultados {

  border-spacing: 1;

  border-collapse: collapse;

  /*background: white;*/

  border-radius: 10px;

  overflow: hidden;

  width: 90%;

  margin: 0 auto;

  position: relative;

}

table#resultados * {

  position: relative;

}

table#resultados td, table th {

  padding-left: 5px;

}

table#resultados thead tr {

  height: 35px;

  background: rgba(22,55,77,1);

  color:#fff;

}

table#resultados tbody tr {

  height: 25px;

}

table#resultados tbody tr:last-child {

  border: 0;

}

table#resultados td, table th {

  text-align: left;

}

table#resultados td, table th {

  text-align: left;

}

table#resultados td:first-child, table th:first-child {

  text-align: left;

	padding-left: 10px;

}

table#resultados td:last-child, table th:last-child {

	text-align: right;

	padding-right: 10px;

}







tbody tr:nth-child(even) {

  /*background-color: #f5f5f5;*/

	background-color: #222222;

}

tbody tr:nth-child(odd) {

  /*background-color: #efefef;*/

	background-color: #111111;

}



tbody tr {

  font-family: OpenSans-Regular;

  font-size: 15px;

  color: #FFFF;

  line-height: 1.2;

  font-weight: unset;

}



tbody tr:hover {

  color: #555555;

  background-color: #f5f5f5;

  cursor: pointer;

}





/********************Product container**************************/



img.bandera{

	vertical-align:middle;

	margin: 0 5px 0 20px;

}



div.boton{

	display: inline-block;

}







div.bloque_proyecciones{

	clear: both;

	margin: 10px;

}





.inpCountry {

	font: 12pt Courier;

	width: 7ch;

	border: 1px solid #999;

}



#productContenedor{

	margin: 0px 0 5px 0;

	padding: 10px 0 0 0;

	width:18%;

	float:left;

}



#labelProduct{

	color:#FFF;

}



/********************Title Slider**************************/



h1{

	margin: 20px 0 5px 0;

	padding: 0px;

	font-size: 16px;

}

p#unidad{

	padding: 0px;

	margin: 0px;

}

p#slider{

	padding: 0px;

	margin: 0 0 10px 0;

}

#sliderContenedor{

	color:#fff;

	text-align: left;

	padding: 10px;

}



#sliderYear{

  margin: 5px 0;

  width: 50%;

}



#labelYear{

	display: none;

}





/********************SVG**************************/

#svg_container{

	width: 100%;

	text-align: center;

	/*background: rgba(22,55,77,1);*/

}



svg{

	max-height: 80vh;

	display: block;

	margin: auto;

	/*background: rgba(22,55,77,1);*/

}



#topContenedor{

	min-height: 20vh;

	width: 100%;

	height: auto;

	/*background: rgba(33,66,99,1);*/

	clear:both;

	text-align: center;

}







#resultadosContenedor{

	/*clear:right;*/

	width: 40%;

	display: inline-block;

	padding: 10px 0 0 0;

}



#sliderContenedor{

	width: 40%;

	display: inline-block;

	vertical-align: top;

}



/********************Title Slider**************************/

div.tooltip_fondo{

	background: #FFF;

}

img.tooltip_bandera{

	vertical-align:middle; 

	margin: 5px;

}

span.tooltip_texto{

	font-size:14px; 

	color:#000000;

}



#tooltip {

  background: #FF9;

  border: 1px solid #999;

  border-radius: 5px;

  padding: 5px;

}



.tooltipTitle{

	margin: 2px;

	font-size: 14px;

	font-weight: bold;

	color: #000;

}

.tooltipText{

	text-align: center;

	margin: 0px 2px 2px;

	font-size: 12px;

	color: #000;

}





.bar{

	height: 12px;

	width: 0%;

}











/**************************MODAL************************/



#modal-background {

    display: none;

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background-color: white;

    opacity: .50;

    -webkit-opacity: .5;

    -moz-opacity: .5;

    filter: alpha(opacity=50);

    z-index: 1000;

}



#modal-content {

    background-color: white;

    border-radius: 10px;

    -webkit-border-radius: 10px;

    -moz-border-radius: 10px;

    box-shadow: 0 0 20px 0 #222;

    -webkit-box-shadow: 0 0 20px 0 #222;

    -moz-box-shadow: 0 0 20px 0 #222;

    display: none;

    height: 240px;

    left: 50%;

    margin: -120px 0 0 -160px;

    padding: 10px;

    position: fixed;

    top: 50%;

    width: 320px;

    z-index: 1000;

}



#modal-background.active, #modal-content.active {

    display: block;

}