/* app_media.css */
/******* MEDIA ***************************************************************************************************/
/* MEDIA 1 este media es solo para PDC! */
@media only screen and (max-width:620px){
  .tblHisLote{
    font-size: 0.9em
  }

  #secProcesoCria{
    font-size: 0.8em
  }
  /*INDICES*/
  /*indice de prenez*/
  .iPrenez{
    top:      33%;
    left:     25%
  }
  .iTacPre{
    top:      38%;
    left:     25%
  }
  /*indices de vacas paridas/prenadas*/
  .iParida{
    top:      32%;
    left:     40.5%
  }
  /*indice de vacas paridas/entoradas*/
  .iParida2{
    top:      36%;
    left:     40.5%
  }
  .iVGor{
    position: absolute;
    top:  69%;
    left: 68.5%
  }
  .iVInv{
    position: absolute;
    top:  72%;
    left: 68.5%
  }
  .iNovi{
    top:  36.5%;
    left: 85%
  }
  .iTMama{
    top:      32.4%;
    left:     54%
  }
  .iTMamo{
    top:      36.4%;
    left:     54%
  }
  .iTera{
    top:  22%;
    left: 68.5%
  }
  .iVaq2{
    top:  20%;
    left: 82.5%
  }
  .iTero{
    top:  42%;
    left: 68.5%
  }
  .iTCT{
    top:  46%;
    left: 68.5%
  }
  .iToroCT{
    top:  52%;
    left: 82.5%
  }
}

/* MEDIA 2 solo maps offline*/
@media only screen and (max-width: 320px){
  #divOutInfoWin{
    font-size:  0.7em;
    max-width:  318px;
  }
  #divInfoWin .iw-content{
    padding:  1px;
  }
    .tblInfo tr td:first-child {width: 70px}
    .tblInfo tr>td:nth-child(2){width: 90px}
    .tblInfo tr>td:nth-child(3){width: auto}

  .potBovKgs{
    margin-left:  1px;
    width:        50px;
  }
  .tblHisLote tr>td:nth-child(2){font-size: 0.8em}
}

/* MEDIA 3 */
@media only screen and (max-width:410px){
  #divOutInfoWin{
    left:           1px;
    top:            0px;
    font-size:      0.9em;
  }
  .tblHisLote tr>td:nth-child(2){font-size:7.6px}

}

@media only screen and (min-width:410px) and (max-width:437px){
  .tblHisLote tr>td:nth-child(2){font-size:10px}
  .divHisCenter{
    max-width:      436px;
  }
}

@media only screen and (min-width:438px) and (max-width:450px){
  .tblHisLote tr>td:nth-child(2){font-size:12px}
}

/*@media only screen and (min-width:430px) and (max-width:520px){
  .tblHisLote tr>td:nth-child(2){font-size:1em}
}*/

/* MEDIA 4 */
@media only screen and (max-width:520px){
  #divOutInfoWin{
    left:           3px;
    top:            0px;
  }
}


/*  MEDIA 17 para el "Desde el" */
@media only screen and (max-width:360px){
  .lblHB{
          margin:     3px 0 0 2px;
          font-size:  0.8em
        }
  .divHD{
    width: 90px;
  }
  .inHB2{
    width:      25px;
    font-size:  0.8em
  }
  .tblApp2, .tblApp2N, .tblApp2P, .divHatoPie{
    table-layout: fixed;
    font-size:    0.9em
  }
  .tblApp2N tr td:nth-child(1){  width:120px}

  .tblApp2P tr td:nth-child(1){  width:120px}
  .tblApp2P tr td:nth-child(2){  width:105px}
  .tblApp2P tr td:nth-child(3){  width:auto}

  divHatoPie{
    font-size:    0.9em
  }
  .inNro2{
    width:        44px;
    margin-right: 1px
  }
}

/* MEDIA 5 */
@media only screen and (max-width:321px){
  .tblHisLote{
    font-size: 0.8em
  }

  .tblTraza{
    font-size:    0.9em
  }
  .tblTraza tr> td:nth-child(5){width: 25px; text-align:right}

  .menuLi{
    margin:       0 5px 0 1px;
  }
  .inCampoNom{
    width:        100px
  }

  div{
    font: 0.95em "Helvetica Neue","sans serif","verdana"
  }

  .divTrazaBal{
    width:      45px;
  }
  .divTrazaSira{
    width:      30px;
  }

  .divTrazaFolders{
    /* float:  left; */
    width:  165px;
    /* padding-top:3px; */
    /* margin: 0 */
  }

  .divTitTraza{
    font-size:    0.8em;
    width:        80px;
  }

  table{
    font:         0.95em "Helvetica Neue","sans serif","verdana";
  }
}


/* MEDIA 6 */
@media only screen and (min-width: 322px) and (max-width: 400px){
  .tblPRVRota{
    font: 0.6em "Helvetica Neue","sans serif","verdana";
  }

  .tblHisLote{
    font-size: 0.8em
  }

  .menuLi{
    margin:       0 5px 0 1px;
    width:        44px;
  }


  .inCampoNom{
    width:        100px
  }

  /* div{ */
    /* font: 0.95em "Helvetica Neue","sans serif","verdana"; */
  /* } */

  .divTrazaBal{
    width:      45px;
  }
  .divTrazaSira{
    width:      30px;
  }

  .divTrazaFolders{
    /* float:  left; */
    width:  165px;
    /* padding-top:3px; */
    /* margin: 0; */
  }

  .divTitTraza{
    font-size:    0.8em;
    width:        80px;
  }

  table{
    font:         0.95em "Helvetica Neue","sans serif","verdana";
  }

  .tblTraza{
    font-size:    1em;
  }
}

/* MEDIA 7 divs de Totales */
@media only screen and (max-width: 431px){
  /*26feb21 incluyo a divOutTotales*/
  #divOutTotales{
    font-size: 0.9em;
  }
    .divCol{
       width: 35px;
    }
    .divColU{
      width:  105px;
    }
  #divTotales{
      font: 0.9em "Microsoft JhengHei","sans serif","verdana"
  }
  /* .divCol12{ */
    /* width:  calc(100% - 380px); */
    /* border: 0.5px solid gray */
  /* } */
}

/* MEDIA 8 */
@media only screen and (min-width: 432px){
    .divCol2{
      width:        45px;
    }
    .divColP{
      width: 38px; /*max-width: 431px*/
    }
}

/* MEDIA 9 */
@media only screen and (min-width: 300px) and (max-width: 691px){
  .tblPRVRota{
    font: 0.75em "Helvetica Neue","sans serif","verdana";
  }
                                                                                /*.divCol12{
                                                                                  width: 80px;
                                                                                }*/
  #tblAgriGxPot, .tblAgriPieC, #tblAgriRinde{
    font: 0.75em "Helvetica Neue","sans serif","verdana";
  }
  .tblAgriGxPot{
    font-size:  0.9em
  }
}
  /* MEDIA 9.1 */
  @media only screen and (min-width: 300px) and (max-width: 520px){
    .divCol12{
      width: 80px;
    }

  }

/***************  *************************************************/
/* MEDIA 10 prueba para que aparezca el nombre del pot */
@media only screen and (min-width: 650px){
  #secTotales{
    width:        600px;
    margin-left:  3px;
    /* height: 100%; */
  }

  .divColP{
    width: 200px; /*max-width: 431px*/
  }

  .divColPN{
    width:    155px; /*ancho del nombre del pot*/
    display:  block;
  }
  /*.divCol12{
    color:    #fff
  }*/
  /*agricultura*/
  .secFlotanteAgri{
    max-width:    920px;
    margin-left:  3px;
  }
}







@media only screen and (min-width: 810px){
  .divHisCenter{
    width:      100%;
    max-width: 750px;
  }
}

/** MEDIA 11 para ubicar al costado cuando hay más de 800px **/
@media only screen and (min-width: 950px){
  .secRepPRVPH{
    width: 500px;
  }

  #divRepAuditoria{
    margin-left: 5px;
  }
  #divTiposRep{
    margin-left: 5px;
  }

  .divHisCenter{
    float:          left;
    width:          100%;
    max-width: 750px;
    padding:        2px;
    background:     none;
  }

  #secGastosAnio{
    float:      left;
  }

  .divProCria{
    font-size:      1.2em;
  }

  /*mapa*/
  #secMapa{
    position:       absolute;
    left:           1px;
    /* left:           451px; */
    top:            1px;
    /* width:          calc(100% - 451px); */
    width:          99.9%;
    height:         99.1%;
    max-height:     900px;
  }

  /** Historias en @media only screen and (min-width:810px) */
  #divHistoriasOut{
    /* position:       absolute; */
    /* left:           460px; */
    top:            1px;
    /* width:          calc(100% - 430px); */
    max-width:      941px;
    background:     #303030;
    padding-bottom: 10px;
    display:        none;
  }

  .divTbl{
    float:    left;
    max-width:  950px;
    width:    100%
  }
    .divTblRow{
      float: left;
      width: 470px
    }
    .divTblRow>div{
      padding-top: 6px;
      float:       left;
      height:      30px
    }

    .divTblRow1{
      float:      left;
      width:      470px;                 /* padding:    0 3px 0 3px; */
      background: #505050; /*#3CBC8D;*/
      color:      #FFF;
      font-size:  1.1em
    }
      .divTblRow1>div{
        float:        left;
        padding-top:  3px;
        height:       30px
      }

      .dTC1{
        width:    60px;
        border-left: 1px solid silver
      }
      .dTC2{
        width:    60px;
        border-left: 1px solid silver
      }
      .dTC3{
        width:    50px;
        border-left: 1px solid silver
      }
      .dTC4{
        width:    150px;
        border-left: 1px solid silver
      }
      .dTC5{
        width:    150px;
        border-left: 1px solid silver
      }
      .dTC6{
        width:  0
      }
      .dTC7{
        width:      auto;
        background: yellow
      }


  /*sanidad*/
  #secSanidad{
    display:    block;
    max-width:  1100px;
    float:      left;
    background: #eaeaea;
    font-size:  1.4em;
  }
    .tblSanidadRep th{
      font-size: 0.7em;
    }
} /*fin de @media only screen and (min-width: 950px){*/


/* MEDIA 12 para ubicar al costado Historia de Potreros cuando hay más de 1300px*/
@media only screen and (max-width: 600px){
  .tblHPot thead tr>td:nth-child(2){display:none} /*nombre del pot solo width>1300px*/
  .tblHPot tbody tr>td:nth-child(2){display:none} /*nombre del pot solo width>1300px*/
}


/* MEDIA 12.1 para ubicar la Historia de Bovinos */
@media only screen and (max-width: 640px){
  #divHistorias{
    margin-left:  0px;
    padding:      0px;
    width:        100%;
  }
  .divHisCenter{
    max-width: 625px;
    float:     left
  }
  .tblHisLote{
    font-size:  0.8em
  }

  .tblHisLote thead {
      position: sticky;
      top: 0;
  }

  .tblHisLote thead tr>th:nth-child(1){width: auto}
  .tblHisLote thead tr>th:nth-child(2){width: 10%}
  .tblHisLote thead tr>th:nth-child(3){width: 20%}
  .tblHisLote thead tr>th:nth-child(4){width: 6.6%}
  .tblHisLote thead tr>th:nth-child(5){width: 6.6%}
  .tblHisLote thead tr>th:nth-child(6){width: 6.6%}
  .tblHisLote thead tr>th:nth-child(7){width: 6.6%}
  .tblHisLote thead tr>th:nth-child(8){width: 5.5%}

  .tblHisLote tbody tr{                                              /* background:       #fff; */
    margin-bottom:    5px;
  }
  .tblHisLote tbody tr:hover{
    background-color: #FFFF99;
  }

  .tblHisLote tbody td{
    padding:    5px 3px 5px 4px;
    text-align: right;
    cursor:     default;
    border:     0.6px solid #e0e0e0;
  }
  /*.tblHisLote tbody tr>td:nth-child(1){width: 220px; text-align:left}
  .tblHisLote tbody tr>td:nth-child(2){width: 74px}
  .tblHisLote tbody tr>td:nth-child(3){width: 190px; text-align:left}
  .tblHisLote tbody tr>td:nth-child(4){width: 50px}
  .tblHisLote tbody tr>td:nth-child(5){width: 40px; color: #009900}
  .tblHisLote tbody tr>td:nth-child(6){width: 40px;   color: #FF3333}
  .tblHisLote tbody tr>td:nth-child(7){width: 60px; color: #FF3333}
  .tblHisLote tbody tr>td:nth-child(8){width: 70px; text-align:right}*/
}



/* MEDIA 13 */
@media only screen and (max-width: 1135px){
  .secFlotante{
    width: 100%
  }
  .divHxPxM{
    margin:     0 auto;
    font-size:  1em;
  }
  /*tbl de stk/pot/día*/
  .tblPotQ tr td:nth-child(1){width:  auto; text-align:left}
  .tblPotQ tr td:nth-child(2){width:  50px; color:#CC0000}
  .tblPotQ tr td:nth-child(3){width:  20%;  cursor:default}
  .tblPotQ tr td:nth-child(4){width:  40px}
  .tblPotQ tr td:nth-child(5){width:  20%;  cursor:default}
  .tblPotQ tr td:nth-child(6){width:  40px}
  .tblPotQ tr td:nth-child(7){width:  20%;  cursor:default}
  .tblPotQ tr td:nth-child(8){width:  40px}

  /* .tblPotStkTot{font-size:  1em;} */
}
/* MEDIA 13.1 */
@media only screen and (max-width: 800px){
  #PotStkDia{
    font-size:  0.9em
  }
}


/* MEDIA 13.2 */
@media only screen and (min-width: 1151px) and (max-width: 1499px){
  /*tbl de stk/pot/día*/
  .tblPotQ tr td:nth-child(1){width:  auto; text-align:left}
  .tblPotQ tr td:nth-child(2){width:  50px; color:#CC0000}
  .tblPotQ tr td:nth-child(3){width:  25%;  cursor:default}
  .tblPotQ tr td:nth-child(4){width:  40px}
  .tblPotQ tr td:nth-child(5){width:  25%;  cursor:default}
  .tblPotQ tr td:nth-child(6){width:  40px}
  .tblPotQ tr td:nth-child(7){width:  25%;  cursor:default}
  .tblPotQ tr td:nth-child(8){width:  40px}

  /* .tblPotStkTot{font-size:  1em;} */
}
/* MEDIA 13.3 */
@media only screen and (max-width: 1500px){
  .secFlotanteStk{
    width: 100%
  }
  #PotStkDia{                     /* margin:     0 auto; */
    font-size:  1em;
  }
}
/* MEDIA 13.4 */
@media only screen and (min-width: 1630px){
  #PotStkDia{
    font-size:  1.1em;
    max-width:  calc(100% - 5px)
  }
  /*tbl de stk/pot/día*/
  .tblPotQ tr td:nth-child(1){width:  auto; text-align:left}
  .tblPotQ tr td:nth-child(2){width:  50px; color:#CC0000}
  .tblPotQ tr td:nth-child(3){width:  21%;  cursor:default}
  .tblPotQ tr td:nth-child(4){width:  40px}
  .tblPotQ tr td:nth-child(5){width:  21%;  cursor:default}
  .tblPotQ tr td:nth-child(6){width:  40px}
  .tblPotQ tr td:nth-child(7){width:  21%;  cursor:default}
  .tblPotQ tr td:nth-child(8){width:  40px}

  /* .tblPotStkTot{font-size:  0.9em;} */
}




/* MEDIA 14 para InfoWin ******/
@media only screen and (min-width: 700px){
  .gm-style-iw{
    max-width:  400px !important;
  }
}


@media only screen and (min-width: 376px) and (max-width: 449px){
  /*.gm-style-iw{
    width: 100% !important;
  }*/

  .gm-style-iw #divInfoWin{
    font-size:  1em;
    margin:     0;
  }
  #divInfoWin .iw-content{
    padding:  1px;
  }

  .tblInfo{
    width:      100%;
    margin:     0;
    margin-top: 2px;
  }
    .tblInfo td{padding:3px 2px 3px 2px; border: 1px solid #E0E0E0}
    .tblInfo tr td:first-child {width: 70px}
    .tblInfo tr>td:nth-child(2){width: 130px}
    .tblInfo tr>td:nth-child(3){width: auto}
}

/* MEDIA 15 */
@media only screen and (max-width: 375px){
  .tblInfoPie td{
    font-size: 12.5px;
  }
    /*.tblInfoPie tr td:first-child{ width:140px}
    .tblInfoPie tr>td:nth-child(2){width:40px; text-align:right}
    .tblInfoPie tr>td:nth-child(3){width:40px;  text-align:right}
    .tblInfoPie tr>td:nth-child(4){width:auto; text-align:right}*/


  .tblInfoWin td{
    font-size:  12.5px;
  }
    .tblInfoWin td{padding:3px 2px 3px 2px; border: 1px solid #e0e0e0}
    .tblInfoWin tr td:first-child{ width: 30px; text-align:right}
    .tblInfoWin tr>td:nth-child(2){width: 100px; white-space:nowrap; overflow:hidden; text-align:left}
    .tblInfoWin tr>td:nth-child(3){width: auto; white-space:nowrap; overflow:hidden; text-align:left}
    .tblInfoWin tr>td:nth-child(4){width: 37px; text-align:right}
    .tblInfoWin tr>td:nth-child(5){width: 40px; text-align:right}
    .tblInfoWin tr>td:nth-child(6){width: 40px; text-align:right}


  /*.gm-style-iw .gm-style-iw-c{
    min-width:  340px !important;
    margin:  0;
  }*/

  /*.gm-style-iw-t{
    width:        100% !important;
  }

  .gm-style-iw-c{
    width:        370px !important;
  }*/

  .gm-style-iw #divInfoWin{
    font-size:  0.9em;
    margin:     0;
    width:      100% !important;
  }

  .iw-title{
  	vertical-align: middle
  }
  #divInfoWin .iw-content{
    padding:  1px;
  }
  .tblInfo{
    width:      100%;
    margin:     0;
    margin-top: 2px;
  }
    .tblInfo td{padding:3px 2px 3px 2px; border: 1px solid #E0E0E0}
    .tblInfo tr td:first-child {width: 70px}
    .tblInfo tr>td:nth-child(2){width: 130px}
    .tblInfo tr>td:nth-child(3){width: auto}

  .tblInfoWin{
    background:       none;
  }
    .tblInfoWin td{padding:3px 2px 3px 2px; border: 1px solid #e0e0e0}
    .tblInfoWin tr td:first-child{ width: 30px; text-align:right}
    .tblInfoWin tr>td:nth-child(2){width: auto; white-space:nowrap; overflow:hidden; text-align:left}
    .tblInfoWin tr>td:nth-child(3){width: 82px; white-space:nowrap; overflow:hidden; text-align:left}
    .tblInfoWin tr>td:nth-child(4){width: 40px; text-align:right}
    .tblInfoWin tr>td:nth-child(5){width: 40px; text-align:right}
    .tblInfoWin tr>td:nth-child(6){width: 40px; text-align:right}
}



/* MEDIA 16 maps cuadrito. Infowin*/
@media only screen and (min-width:322px) and (max-width:415px){
  .tblGIPie tr> td:nth-child(1){width: 15px}
  .tblGIPie tr> td:nth-child(2){width: 10px}
  .tblGIPie tr> td:nth-child(3){width: auto; text-align:right}
  .tblGIPie tr> td:nth-child(4){width: 80px}
  .tblGIPie tr> td:nth-child(5){width: 50px; text-align:right}
  .tblGIPie tr> td:nth-child(6){width: 80px; text-align:right}
  .tblGIPie tr> td:nth-child(7){width: 90px; text-align:right}

  #divInfoWin{
    max-width:  400px;
  }
  .divInfoWin{
    font-size:  1em;
  }
  #divInfoWin .iw-content{     /* font-size:     0.9em; */
    padding:       6px;
  }

    .div-iw111{
      width:       40px;
      float:       left;
      margin-left: 40px;
    }
    .div-iw222{
      width:      80px;
      float:      left;
      text-align: right;
    }
}


/* MEDIA 17 para imprimir reporte rotaciones PRV */
@media print{                                         /*main *:not(.secRepPRVRota){display: none;}*/
  .secRepPRVRota{
    width:      1920px;
    margin-top: 30px
  }
  /* .aX{display:none} */
  .aX, .divPPRV{display:none}
}



/*** min-width solo
 MEDIA 8                                                  @media only screen and (min-width: 432px){
 MEDIA 10 prueba para que aparezca el nombre del pot      @media only screen and (min-width: 650px){
 MEDIA 11 para ubicar al costado cuando hay más de 800px  @media only screen and (min-width: 950px){

/*** max-width solo

 MEDIA 2 solo maps offline  @media only screen and (max-width: 320px){
 MEDIA 5                    @media only screen and (max-width: 321px){
 MEDIA 3                    @media only screen and (max-width: 410px){
 MEDIA 7 divs de Totales    @media only screen and (max-width: 431px){
 MEDIA 4                    @media only screen and (max-width: 520px){
 MEDIA 1 solo PDC           @media only screen and (max-width: 620px){
 MEDIA 12 ubicar al costado @media only screen and (max-width: 930px){  Historia de Potreros cuando hay más de 1300px...???
 MEDIA 13                   @media only screen and (max-width: 1040px){


/*** min & max width juntos
 MEDIA 9                          @media only screen and (min-width: 300px) and (max-width: 691px){
 MEDIA 15                         @media only screen and (min-width: 320px) and (max-width: 375px){
 MEDIA 16 maps cuadrito. Infowin  @media only screen and (min-width: 322px) and (max-width: 415px){
 MEDIA 6                          @media only screen and (min-width: 322px) and (max-width: 400px){
 MEDIA 14 para InfoWin            @media only screen and (min-width: 376px) and (max-width: 449px){



/*** para imprimir reporte
 MEDIA 17  rotaciones PRV         @media print{

/*@media all and (orientation:landscape) {}           @media all and (orientation:portrait) {}*/