/*------------------------Inicio Tabla de datos-------------------------*/
.tabla_datos{
  width: 82%;
  height: auto;
}
.tabla-scroll table {
  width: 82%;
}
.tabla-scroll thead th {
  font-size: 28px;
}
.tabla-scroll-w table {
  width: 100%;
}
.tabla-scroll-w thead th {
  font-size: 28px;
}
/*Inicio datos otros*/
.tabla-scroll-otros {
  overflow:overlay;
  height:400px;
  width:82%;
  background-color: #eeeff4;
  border-radius: 25px;
  margin-top: 20px;
  margin-left: 9%;
  color: #425173;
}
.tabla-scroll-otros table {
  width: 98%;
}
.tabla-scroll-otros thead th {
  font-size: 28px;
}
.tabla-scroll-otros-w table {
  width: 100%;
}
.tabla-scroll-otros-w thead th {
  font-size: 28px;
}
.valores-otros{
  white-space: nowrap;
  text-align: center;
}
.concepto-otros{
  width: 70%;
  margin-left: 40px;
}
/* final datos_otros */
.titulo_concepto{
  padding-top: 15px;
  padding-bottom: 15px;
  font-size: 20px;
  margin-left: 7%;
  color: #6b6c6e;
}
.titulo_monto{
  padding-top: 15px;
  padding-bottom: 15px;
  font-size: 20px;
  color: #6b6c6e;
}
.titulo_porcentaje{
  padding-top: 15px;
  padding-right: 10px;
  padding-bottom: 15px;
  font-size: 20px;
  text-align: center;
  color: #6b6c6e;
}

  .titulo_concepto_otros{
    padding-top: 15px;
    padding-bottom: 15px;
    font-size: 20px;
    margin-left: 13%;
    color: #6b6c6e;
  }
  .titulo_monto_otros{
    padding-top: 15px;
    padding-bottom: 15px;
    font-size: 20px;
    margin-left: 0%;
    color: #6b6c6e;
    text-align: center;
    white-space: nowrap;
  }
  .titulo_porcentaje_otros{
    padding-top: 15px;
    padding-bottom: 15px;
    font-size: 20px;
    text-align: center;
    color: #6b6c6e;
    text-align: center;
    white-space: nowrap;
  }

  /*estilo scroll*/
  ::-webkit-scrollbar {
    width: 10px;
  }
  ::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey;
    border-radius: 10px;
  }
  ::-webkit-scrollbar-thumb {
    background: #0e1f4a;
    border-radius: 10px;
  }
  ::-webkit-scrollbar-thumb:hover {
    background: #1e439f;
  }

  .valores{
    text-align: left;
  }
  .primero{
    width: 60%;
  }


  /*----barra colores-----*/
  .colores div {
    text-align: justify;
    float: left;
    height: 40px;
    overflow: hidden;
  }
  .colores div:nth-child(odd) {
    margin-top: 0%;
    margin-bottom: 0%;
    margin-left: 30px;
    margin-right: 5px;
    width: 5px;
  }
  .colores div:nth-child(even) {
    margin-top: 0%;
    margin-left: 0%;
  }
  .colores p{
    padding: 10px;
  }
  /*----barra colores Otros-----*/
  .coloresO img {
    margin-top: -10px;
  }
  .coloresO div {
    text-align: justify;
    float: left;
    height: 40px;
    overflow: hidden;
  }
  .coloresO div:nth-child(odd) {
    margin-top: 1%;
    margin-bottom: 1%;
    margin-left: 30px;
    width: 5px;
  }
  .coloresO div:nth-child(even) {
    margin-top: 1%;
    text-align: left;
    margin-left: 3%;
  }
  .coloresO p{
    text-align: left;
  }
  /*---------------------Fin Tabla de datos-----------------------------------*/

  /*---------------------Inicio Botones RRSS----------------------------------*/
    .shared-panel-sup {
      margin: 80px 9% 50px 9%;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
    }
    .shared-graficos{
      grid-column: 1 / 3;
      grid-row: 1;
      margin-left: calc(100% - 350px);
    }
    .shared-graficos-botones{
      background-color: #bfbfc1;
      display: inline-block;
      border-radius: 10px;
    }
    .shared-panel{
      margin-top: -1%;
      margin-right: 2%;

      align-self:flex-end;
      grid-column: 3;
      grid-row: 1;
    }
    .shared {
      display: inline-block;
      width: 40px;
      height: 40px;
      margin-bottom: 5%;
      margin-right: 1%;
      /* Recurso incluido en la descarga del ejemplo */
      float: right;
      cursor: pointer;
    }

  /*---------------------Fin Botones RRSS----------------------------------*/

  /*---------------------Inicio Graficas----------------------------------*/
    /* Style the tab */
    .tab {
      margin-top: 70px;
      margin-left: 9%;
      overflow: auto;
      width: 30%;
      background-color: #ffffff;
      border-radius: 10px;
      /*box-shadow: 2px 2px 10px #999;*/
    }
    /* Style the buttons inside the tab */

    .tab img{
      width: 30%;
    }

    .tab button{
      padding: 0px 0px;
    }
    /* Style the tab content */
    .tabcontent {
      width: 82%;
      margin-left: 9%;
      margin-top: 15px;
      background-color: #eeeff4;
      border-radius: 25px;
      padding: 6px 12px;
    }
    #grafica_pie{
      margin-top: 80px;
    }
  /*---------------------Fin Graficas----------------------------------*/
  /*---------------------Inicio Descarga excel----------------------------------*/
  .descarga_contenedor{
    padding-top: 0px;
    width: 82%;
    margin-left: 9%;
    display: flex;
    flex-direction: row;
    padding-bottom: 20px;
    justify-content: space-around; /*space-between*/;
    flex-wrap: wrap;
  }
  .elementoDescarga{
    width: 300px;
    text-align: center;
    padding-top: 20px;
  }
  .descarga img{
    padding: 10px;
  }
  /*---------------------Fin Descarga excel----------------------------------*/
    @media only screen and (max-width: 1024px) {
        .montos_container{
            margin-top: -115px;
        }
        .shared-panel-sup {
            grid-template-columns: repeat(1, 1fr);
        }
        .shared-panel{
            grid-column: 1;
            /*margin-top: 50px;*/
        }
        .toggle_radio{
            margin-left: 0!important
        }
    }
    @media only screen and (max-width: 540px) {
        .montos_container {
            margin-top: -150px;
        }
        .shared-panel {
            margin-top: 50px;
        }
        .montos, .toggle_radio{
            margin-right: 0!important
        }
    }