/**************************************************************
*****************Ejes y Leyendas Graficos**********************
***************************************************************/
.legendY,
.legendX{
  font-family: 'Roboto-regular', sans-serif;
  font-size: 12px!important;
  font-weight: bold!important;
}

.axis path,
.axis line {
  fill: none;
  stroke: #D4D8DA;
  stroke-width: 2px;
  shape-rendering: crispEdges;
}

g.axis > .tick > text {
	font-family: 'Roboto-regular', sans-serif;
	font-size: .4vw;
}

.tooltip-grafico {
	font-family: 'Roboto-regular', sans-serif;
      background: #eee;
      box-shadow: 0 0 5px #999999;
      color: #333;
      display: none;
      font-size: 12px;
      left: 130px;
      padding: 10px;
      position: absolute;
      text-align: center;
      top: 95px;
      width: auto;
	white-space: normal;
    overflow-wrap: break-word;
    word-break: break-word;
      z-index: 10;
}
/**************************************************************
*****************Tabla de Referencias**************************
***************************************************************/

#container-tabla tbody tr,
#container-tabla tbody td {
	padding:5px 20px!important;
	font-size: 12px;
	text-transform: uppercase;
}

td { border: 1px solid #1f9bde; }
.title, .size { width: auto; }
.tabla-row td {	background:#fff;	}

#container-tabla {
display: inline-block;

}
#tabla-datos{
  /*  display: none; */
}
.buttons-container{
	padding-top: 3%;
    padding-bottom: 1%;
}
#table-button{
	margin-top: 3%;
	margin-right:1%;
	text-transform:uppercase;
}
#more-button{
	margin-top:3%;
	margin-left:0px;
	font-size: 14px;
}
#more-button a{
	color:#333;
}
#more-button a:hover, #more-button a:focus{
	text-decoration:none;	
}


thead th{
	padding: 8px 20px!important;	
}
tfoot th{
	padding: 2px 20px 0px 20px!important;	
}
thead .title, thead .size, .size{text-align:center!important;}
.title{text-align:left!important;}

@media (max-width: 1366px) {
	g.axis > .tick > text, text.column-value {  font-size: .6vw!important; }
	text.column-value:hover {  font-size: .7vw!important; }
	text { font-size: .75vw; }
}
@media ( max-width: 992px) {
	#container-tabla {
		display: unset;
	}
	.grafico-tabla-aux table{ 
	  overflow-x: auto;
	}
	#tabla-datos.tabla-simple {
    	display: inline-block;
	}
	
}
@media ( max-width: 576px) {
	#table-button, #more-button{font-size:12px;}