/*ETIQUETAS*/
textarea {
  resize: none;
}

/*.navbar #navAvances ul.submenu {
  visibility: hidden;
}

.navbar #navAvances:hover > ul.submenu {
  visibility: visible;
}*/

a:not([href]):not([tabindex]) {
  color: #3f3f3f;
  text-shadow: 0 1px 0 #3f3f3f;
  text-decoration: none;
}

.cssTitulo {
  color: #435263;
  font-size: 20px;
  font-family: Tahoma, Helvetica, Arial, sans-serif;
  font-weight: bold;
  border-bottom: 1px solid #CCCCCC;
  padding-bottom: 1px;
}

hr {
  margin: .5rem 0 .5rem 0;
}

span > label {
  margin-bottom: 0px;
  vertical-align: text-bottom; /*para que no quede tan abajo de su input*/
  margin-left: 5px;
}

input[type="radio"] {
  margin-right: 5px;
  vertical-align: inherit;
}

.treeview-fondo {
  background-color: #fff;
}

.nav-tabs > li > a {
  text-decoration: none;
}

.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
    color: #555;
    cursor: default;
    background-color: #fff;
    border: 1px solid #ddd;
    border-bottom-color: transparent;
}
.nav-tabs>li>a {
    margin-right: 2px;
    line-height: 1.42857143;
    border-radius: 4px 4px 0 0;
}
.nav>li>a {
    position: relative;
    display: block;
    padding: 10px 15px;
    
}

.nav-tabs>li {
    float: left;
    margin-bottom: -1px;
}

.row-card > input[type=checkbox] {
  margin-right: 5px;
}

.ccsBackTitulo
{
	border: 1px #E0F7FF;
	background-color: #F7FCFF;
	height: 20px;
}

.cssBorde {
  border: 1px solid #ddd !important;
}

.cssBorde-Gris {
  border: 1px solid rgba(0,0,0,.125);
}

.cssBorde-Oscuro {
  border: 1px solid #adadad !important;
}

.cssBorde-Tabs {
  border-bottom: 1px solid rgba(0,0,0,.125);
  border-left: 1px solid rgba(0,0,0,.125);
  border-right: 1px solid rgba(0,0,0,.125);
  margin-bottom: 10px;
  padding: 5px 10px 4px 10px;
}

.cssBordes {
  border: 1px solid rgba(0,0,0,.125);
  margin-bottom: 10px;
  padding: 5px 10px 4px 10px;
}

.cssBorde-Simple {
  border: 1px solid rgba(0,0,0,.125);
  padding: 5px 10px 4px 10px;
}

.cssCheckbox-filtro > span {
  display: flex;
  justify-content: space-between;
}

.cssFondo-Gris {
  background-color: #ababab;
  border: 1px solid #ddd;
}

.cssPadding-Botones {
  padding: 2px 5px;
}

.cssImagen {
  object-fit: cover;
}

.cssSiguiente,
.cssAnterior {
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
  background: rgba(115, 147, 179, 0.1);
  padding: 10px;
  color: white;
  font-weight: bold;
  user-select: none;
}

  .cssSiguiente:hover,
  .cssAnterior:hover {
    background: rgba(54, 69, 79, 0.3);
    color: white;
    text-decoration: none;
  }

.cssGaleria {
  width: 100%;
  overflow-x: auto;
  white-space: nowrap;
  padding-bottom: 15px;
  box-sizing: border-box; 
}

.cssImagen-Galeria {
  display: inline-block!important;
  vertical-align: top; 
  margin-right: 10px; 
  width: 142px;
  height: 142px;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

  .cssImagen-Galeria img {
    max-width: 100%;
    max-height: 100%;
    width: auto; 
    height: auto; 
    display: block;
  }

.cssRow-Gap-6 {
  display: flex;
  flex-direction: column;
  row-gap: 6px;
}

.card-body-formulario {
  background-color: #f0f0f0;
  display:flex;
  flex-direction:column;
  row-gap: 6px;
  max-height: 90vh;
  overflow: auto;
  padding: 12px;
}

.card-body {
  background-color: #f0f0f0;
  max-height: 90vh;
  overflow-x: auto;
  overflow-y: auto;
  padding: 12px 12px 2px 12px;
}

.card-header {
  background-color: #c7d5e3;
}

.color-transparente {
  color: transparent;
}

.table-hover .color-transparente:hover {
  color: transparent;
}

  .cssBoton {
  background-color: #e1e1e1;
  border: 1px solid #adadad !important;
}

.cssBoton-Filtrar {
  background: url(../../Imagenes/Botones/imgFiltrar.png) left 3px top 5px no-repeat #e1e1e1;
  border: 1px solid #adadad !important;
}

  .cssBoton-Filtrar:hover, .cssBoton:hover {
    /*color: #fff;*/
    background-color: #e5f1fb;
    border-color: #0078d7 !important;
  }

.cssCover {
  object-fit: none;
}

.cssCampos
{
	color: #000000;
	font-weight: bold;
	font-size: 12px;
	font-family: Tahoma, Helvetica, Arial, sans-serif;
	width: 100%;
	line-height: 20px;
}

.cssCentro {
  text-align: center;
}

.cssEspacio {
    margin-right: 5px;
}

.cssMensajes
{
	color:#435263;
    font-size:12px;
    font-family: Tahoma, Helvetica, Arial, sans-serif;
    font-weight:bold;
    text-align:center 
    /*border-bottom: 1px solid #CCCCCC;
    padding-bottom: 1px;*/
}

.cssPadding-Sup-5 {
  padding-top: 5px;
}

.cssPadding-8 {
  padding-left: 8px;
  padding-right: 8px;
}

.cssPadding-2 {
  padding-left: 2rem;
  padding-right: 2rem;
}

.cssPadding-10 {
  padding-left: 10px;
  padding-right: 10px;
}

.cssPadding-15 {
  padding-left: 15px;
  padding-right: 15px;
}

.cssPadding-imagebutton {
  padding: 0 4.2rem 0 4.2rem;
  background-color: #e1e1e1;
}

.cssPadding-Boton-Fila {
  padding-bottom: 1px;
  padding-top: 1px;
}

.cssRight {
    float: right;
}

.pnlSenales_Horizontales, .pnlDrenajes_Transversales, .pnlObras_Arte, .pnlPuentes, .pnlDispositivos, .pnlBanquinas, .pnlInformacion, .pnlBaches, .pnlPosteKm, .pnlCruces, .pnlCurvas, .pnlParada_Autobus, .pnlEstacion, .pnlInspecciones, .pnlSecciones {
   display: none;
}

.pnlSenales_Verticales {
   display: none;
}

.pnlDrenajes_Longitudinales {
   display: none;
}


.divContenedor {
  justify-content: center;
  margin: auto;
  width: 120vmin;
  background-size: cover;
  background-color:white; 
  border: 5px solid #f0f0f0;
  border-radius: 15px;
  box-shadow: 0px 20px 50px -15px rgba(0, 0, 0, 0.6);
  text-align: center;
}

    .divContenedor > .row-card {
        text-align: left;
        padding-left: 10px;
    }

/*INVENTARIOS*/
button, select {
    text-transform: none;
    width: inherit;
}

.item1 { grid-area: 1 / 1 / span 1 / span 1/*filtros*/; }
.item2 { grid-area: 2 / 1 / span 1 / span 1/*menuinv;*/ }
.item3 { grid-area: 1 / 2 / span 2 / span 4/*inventario*/; }

.grid-container-inventario {
    display: grid;
    /*grid-template-areas: 'filtros inventario inventario inventario inventario'
                         'menuinv inventario inventario inventario inventario'
                         'menuinv inventario inventario inventario inventario';*/
    grid-template-columns: 20vw auto auto auto auto;

    /*grid-template-columns: 20vw 1fr;*/
    grid-gap: 5px;
}

    .grid-container-inventario > .item2 {
        background-color:rgb(73, 172, 206);
    }

    .grid-container-inventario > .item1 {
        background-color: #C2C2C2;
    }

    .h-1{
  height:38vh;
  width:20vw;
}

    .h-2{
  height:52vh;
  width:20vw;
}

      .h-2 > ul > li, .cssLista-Menu > li {
        margin-bottom: 5px;
      }

    .h-2 > ul > li:hover {
          background: rgb(167,208,227);
          cursor: pointer;
    }

        .h-2 > ul > li > a, .cssLista-Menu > li > a {
          color: white;
          font-size: 12px;
          font-weight: bold;
          /*font-family: 'Myriad Web Pro';*/
          text-shadow: none;
          padding: .5rem 1rem 1rem 1rem; /*para que  en el hover entre toda la flechita*/
        }

        .h-2 > ul > li > input, .cssLista-Menu > li > input {
          color: white;
          font-size: 12px;
          font-weight: bold;
          /*font-family: 'Myriad Web Pro';*/
          background-color: transparent;
          border: none;
          /*padding-left: 0px;
        padding-top: 0.5rem;
        padding-right: 0px;
        padding-bottom: 1rem; para que toda la imagen se resalte en el hover*/
          /*width: calc(100% - 45px); el ancho del contenedor menos lo que ocupa la imagen*/
          text-align: left; /*mientras no este la imagen ej informes*/
        }

      .h-2 > ul,
      .cssBorde-Gris > ul {
        list-style-type: none;
        padding: 10px;
        margin: 0;
      }

      .h-2 > .nav-link:hover, .cssLista-Menu > .nav-link:hover,
      .cssBorde-Gris > .nav-link:hover {
        background-color: transparent !important;
      }

        .h-2 > ul > .nav-link, .cssLista-Menu > .nav-link
        input .nav-link {
          transition: background-color .02s;
          /*text-shadow :1px 0 0 white;*/
        }

          .h-2 > ul > .nav-link:hover, .cssLista-Menu > .nav-link:hover {
            cursor: pointer;
          }

.cssLista-Menu {
  list-style-type: none;
  padding: 10px 10px 0 10px;
  margin: 0;
}

        .h-3 {
          /*height:90vh;*/
          height: 95vh;
          margin-top: 5vh;
        }

.cssBorde-Gris > ul > li:hover {
  cursor:pointer;
}

.cssBorde-Gris > ul > li > input {
  color: white;
  font-size: 12px;
  font-weight: bold;
  background-color: transparent;
  border: none;
  padding-left: 20px;
  padding-top: 0.5rem;
  padding-right: 0px;
  padding-bottom: 1rem; /*para que toda la imagen se resalte en el hover*/
  text-align: left;
  width: calc(100% - 45px); /*el ancho del contenedor menos lo que ocupa la imagen*/
}

.cssBorde-Gris > ul > li > img {
  /*height: 33px;
  width: 33px;*/
  padding-left: 10px;
}

.sin-sombra {
  text-shadow: none;
}

.sombra-negra {
  text-shadow: 0 2px 3px rgba(0, 0, 0, 0.3);
}

.grid1-2 {
  display: grid;
  grid-template-columns: 1fr 2fr;
  column-gap: 8px;
}

.grid2-1 {
  display: grid;
  grid-template-columns: 2fr 1fr;
  column-gap: 8px;
}

.divisor-card {
  display: grid;
  grid-template-columns: 1fr 4fr;
  /*column-gap: 12px;*/
}

.card-menu {
  color: #003142;
  background-color: #f0f0f0;
  /*max-height: 430px;*/
  max-height: 588px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.card-menu div {
  background: #49acce;
}

  .card-menu div:last-child {
    background: #49acce;
    overflow-x: auto;
    overflow-y: auto;
  }

  .card-menu ul {
    white-space: nowrap;
    font-weight: bold;
    text-shadow: none;
  }

.cssCmdPaquetes {
  margin: 0 20px 15px 20px;
}

.cssCmdCalendario {
  margin-left: 5px;
}

.cssCmdLupaCentrada {
  margin: auto;
}

.cssCmdSinistro {
  padding-bottom: 2px;
  padding-top: 2px;
}

.cssImgOpciones {
    width :35px;
    height :35px;
    float: left;
    margin: 0 5px 0 5px;
}

.cssImgCalendario .ajax__calendar_container {
    border:1px solid #646464;
    background-color: white;
    /*width: 190px;*/
}

/*.cssImgCalendario .ajax__calendar_container .ajax__calendar_body {
    width: 170px;
}*/

.cssImgCalendario * {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}

.card, legend {
  font-size: 0.75rem;
}

  .card .form-control,
  .card-login .form-control {
    height: calc(1.2rem + 2px);
    font-size: 0.75rem;
    padding: .375rem .5rem;
  }

/*.card .login-titulo{
  font-size: 16px;
}
*/
.card-login {
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  background-repeat: no-repeat;
  background-color: transparent;
  background-size: cover;
}

 .form-control:disabled, .form-control[readonly] {
    height: calc(1.3rem + 2px);
}

/*CONTROLES*/
.modal-prioridad {
  z-index: 70000 !important;
}

.modalPopup {
    box-shadow: 1px 2px 10px 0px rgba(0, 0, 0, 0.3);
}

nav {
    z-index: 9999;
}

ul {
    z-index:9999;
}
form {
    z-index:5;
}

body {
    line-height: 1.7; 
    text-shadow: 0 1px 0 #ffffff;
    font: bold;
    font-size: 0.8rem;
}

.btn {
  font-size: 0.78rem;
}

.form-control {
  font-size: 0.78rem;
}

.tab-content {
  background-color: #fff;
}

.tab-pane .cssMargen-Inferior-0 {
  margin-bottom: 0;
}

.cssBtnPropuestas {
  margin-left: 5px;
  padding-top: 1px;
  padding-bottom: 1px;
}

.csstxtCampos
{
    /*font-size: 10px;
    font-weight: normal;
    line-height: 10px;
    font-family: Tahoma, Helvetica, Arial, sans-serif;
    width:160px;*/
    padding-top: 15px;
    padding-bottom: 0px;
    padding-right: 8px !important;
    padding-left: 0px !important;
    text-align:center;
    margin: 0px !important;
    /*border-radius:*/ 
 }

.csslblTitError
{
	font-size: 20px;	
	font-family: Tahoma, Helvetica, Arial, sans-serif; 
	font-weight: bold;
	white-space: nowrap; 
	color: Black; 
	text-align: left;
}

.csslblMsjError
{
	width: 80%;
	/*font-size: 15px;*/ 
    
	border-top-style: none; 
	border-right-style: none; 
	border-left-style: none;
	border-bottom-style: none; 
	background-color: transparent; 
	color: Red;
	text-align: left;
}

.csslblColor {
  color: rgb(73, 172, 206);
}

/*HTML*/

.cssdivMsjError {
  position: fixed;
  bottom: 0;
  right: 0;
  /*height: 12vh;*/
  width: calc(100% - 60px);
  /*left: 60px;
	width: calc(100% - 60px);
    z-index: 999;*/
  border: 1px solid #A7B8C1;
  background: #cecece;
  opacity: 0.85;
  /*display: none;*/
  min-height: 100px;
  top: auto !important;
}

#frmLogin .cssdivMsjError {
  width: 100%;
}

.cssDivLoginEx {
  position: absolute; /*nos posicionamos en el centro del navegador*/
  /*top:50%;
	left:50%;*/
  width: 400px; /*determinamos una anchura*/
  margin-left: -200px; /*indicamos que el margen izquierdo, es la mitad de la anchura*/
  height: 200px; /*determinamos una altura*/
  margin-top: -100px; /*indicamos que el margen superior, es la mitad de la altura*/
  padding: 5px;
  padding: 2rem;
}

.cssDivContainer {
    display: inline-block;
    text-align: center; /*nos posicionamos en el centro del navegador*/
    /*width:100%;
    flex-align:center;
    display: flex;
  align-items: center;
  justify-items: center*/
    /*max-width: 1140px*/
}

.cssDivLoginCerrar {
    margin-left:auto; 
    margin-right: 10px;
}

.cssDivMsg {
    display:inline-block; 
    vertical-align: middle; 
    margin-left: 20px;
}

.cssImgCandado {
    width: 120px; 
    height: 120px
}

.cssImgMsg {
    vertical-align: middle;
}

.cssImgLupa {
  vertical-align: bottom;
}

.cssSecLogin {
    margin: 10px 0px;
}

.card {
    position: relative;
    display: flex;
    flex-direction: column; 
    background-clip: border-box;
    /*background-color: white;*/
    word-wrap:break-word;
    margin-left: auto;
}

.cssDivLoginLogo
{
    margin-top: 5px;
	/*position: absolute; 
	width: 200px;
	margin-left: 100px;
	height: 60px;
	margin-top: -15px;
	right: 7.5%; 
	top: 5%;*/
}

.cssBodyBackGround {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  background-size: cover;
}

body {
  background-attachment: fixed;
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover;
}

.cssbodySinScroll {
   overflow: hidden;
}

.cssAlto-70 {
  height: 70px;
}

.cssAlto-85 {
  height: 85px;
}

.cssAlto-120 {
  height: 120px;
}

.cssAlto-130 {
  height: 130px;
}

.cssAlto-155 {
  height: 155px;
}

.cssAlto-175 {
  height: 175px;
}

.cssAlto-190 {
  height: 190px;
}

.cssAlto-240 {
  height: 240px;
}

.cssAlto-250 {
  height: 250px;
}

.cssAlto-300 {
  height: 300px;
}

.cssAlto-315 {
  height: 315px;
}

.cssAlto-330 {
  height: 330px;
}

.cssAlto-355 {
  height: 355px; /*propuestas*/
}

.cssAlto-Puente {
  height: 360px;
}

.cssAlto-375 {
  height: 375px;
}

.cssAlto-390 {
  height: 390px;
}

.cssAncho-30 {
  width: 30vw;
  margin: auto;
}

.cssAncho-35 {
  width: 35vw;
  min-width: 500px;
}

.cssAncho-350 {
  width: 350px;
}

.cssAncho-423 {
  width: 423px;
}

.cssAncho-45 {
  width: 45vw;
}

.cssAncho-460 {
  width: 460px;
}

.cssAncho-50 {
  width: 50vw;
  min-width: 710px;
}

.cssAncho-50px {
  width: 50px;
}

.cssAncho-500 {
  width: 500px;
}

.cssAncho-560 {
  width: 560px;
}

.cssAncho-55 {
  width: 55vw;
}

.cssAncho-65 {
  width: 65vw;
}

.cssAncho-630 {
  width: 630px;
}

.cssancho-70vw {
  width: 70vw;
  margin: auto;
}

.cssAncho-700px {
  width: 700px;
}

.cssAncho-710 {
  width: 710px;
}

.cssAncho-75 {
  width: 75px;
}

.cssAncho-750 {
  width: 750px;
}

.cssAncho-70 {
  width: 70%;
}

.cssAncho-800 {
  width: 810px;
}

.cssAncho-85 {
  width: 85%;
}

.cssAncho-85px {
  width: 85px;
}

.cssAncho-900px {
  width: 900px;
}

.cssAncho-920px {
  width: 920px;
}

.cssAncho-940 {
  width: 940px;
}

.cssAncho-980 {
  width: 980px;
}

.cssAncho-1050 {
  width: 1050px;
}

.cssAncho-1200 {
  width: 1200px;
}

.cssBorde-Lineas {
  border: 1px dashed #c1c1c1;
}

.cssBorde-Claro {
  border: 1px solid #e1e1e1;
}

.cssBuscar {
    grid-column: 6 / span 1;
    text-align: center;
}

.cssCentro {
  justify-items: center;
}

.cssDerecha { text-align:right; }

.cssIzquierda {
  text-align: left;
}

.cssFieldset {
  /*display: block;
  margin-inline-start: 2px;
  margin-inline-end: 2px;
  padding-block-start: 0.35em;
  padding-inline-start: 0.75em;
  padding-inline-end: 0.75em;
  padding-block-end: 0.625em;
  min-inline-size: min-content*/;
  border: 1px solid rgba(0,0,0,.125);
  /*border-style: groove;
  border-color: rgb(192, 192, 192);
  border-image: initial;*/
  margin-bottom: 0;
}

.cssLegend {
  width: auto;
}

.cssMarco {
    /*position:absolute;
    top:50%;
    left:50%;*/
    min-width:45%;
    /*height:400px;*/
    display:block;
    margin:auto;
    /*margin-top: -300px;
    margin-left: -400px;*/
    box-shadow: 1px 2px 10px 0px rgba(0, 0, 0, 0.3);
    color: #3F3F3F;
    overflow:hidden;
}

.cssMargen-Auto {
  margin: auto;
}

.cssMargen-Inferior-0 {
  margin-bottom: 0!important;
 }

.cssMargen-Inferior-10 {
  margin-bottom: 10px;
}

.tab-pane .cssMargen-Superior-0 {
  margin-top: 0;
}

.cssMargen-Superior-0 {
  margin-top: 0!important;
}

.cssMargen-Superior-5 {
  margin-top: 5px;
}

.cssMargen-Superior-10 {
  margin-top: 10px;
}

.cssMargen-Superior-15 {
  margin-top: 15px;
}

.cssMargen-Derecho-5 {
  margin-right: 5px;
}

.cssMargen-Derecho-10 {
  margin-right: 10px;
}

.cssMargen-Derecho-20 {
  margin-right: 20px;
}

.cssMargen-Izquierdo-0 {
  margin-left: 0;
}

.cssMargen-Izquierdo-5 {
  margin-left: 5px;
}

.cssMargen-Izquierdo-10 {
  margin-left: 10px;
}

.cssMargen-Izquierdo-20 {
  margin-left: 20px;
}

.cssMargen-Izquierdo-30 {
  margin-left: 30px;
}

.cssNegrita {
  font-weight: bold;
}

.cssOculto {
  display: none;
}

.cssPadding-Tabla {
  padding: 0 15px 15px 15px;
}

.cssPaddingY-Tabla th{
  padding: .5rem;
}

.cssTabla {
  margin-top: 15px;
  background-color: #ababab;
  border: 1px solid #ddd;
}

.cssPadding-Tab td, .cssPadding-Tab  th {
  padding: .25rem;
}

  .cssTablaLogin {
    height: 300px;
    width: 400px;
    border: #F7FCFF;
    border-style: solid;
    background: white;
    margin-left: auto;
    margin-right: auto;
    margin-top: 100px;
  }

.cssImageButton { max-height: 25vw; max-width: 25vw;} 

.cssTablaRutas {
    height:350px;
}

.cssTablaTramos {
    height: 230px;
}

.flex-container {
  display: flex;
  align-items: stretch;
  background-color: #f1f1f1;
}

.flex-container > div {
  
  width: 30vw;
  margin: 10px;
}

.grid-container-login {
  display: grid;
  grid-template-columns: 1fr 187px;
}

  .grid-container-login .datos {
    padding: 68px 30px 52px 54px;
  }

  .grid-container-login .datos-sistema {
    padding-top: 38px;
    padding-left: 13px;
    padding-right: 25px;
  }

#lblAppNameFull {
  font-size: 14px;
}

.grid-container-imagen {
  display: grid;
  grid-template-columns: 1fr 142px;
  column-gap: 6px;
}

.grid-container {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-column-gap: .2rem;
}

.grid-container-2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-column-gap: .5rem;
}

.grid-container-4 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-column-gap: .5rem;
}

.grid-container-8 {
  display: grid;
 /* grid-template-columns: repeat(8, 1fr);*/
  grid-template-columns: repeat(8, minmax(0, 1fr));
}

.grid-container-12 {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-column-gap: .2rem;
}

.grid-container-14 {
  display: grid;
  grid-template-columns: repeat(14, 1fr);
  grid-column-gap: .2rem;
}

.grid-container-16 {
  display: grid;
  grid-template-columns: repeat(16, 1fr);
}

.cssFiltro {
  grid-column: 2 / span 2;
}

.cssFiltro .cssInput {
    margin-left:10px;
}


.cssFondoLila {
  background-color: rgb(192,192,255);
}

.cssCeldasPOA {
  text-align: center;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-gap: 10px;
}

.cssCeldasPOA-Red {
  text-align: center;
  display: grid;
  grid-template-columns: 60px 1fr 1fr 1fr 1fr 1fr;
  grid-gap: 10px;
}

.cssGrid1-1 {
  grid-column: 1 / span 1;
}

.cssGrid1-3 {
  grid-column: 1 / span 3;
}

.cssGrid1-4 {
  grid-column: 1 / span 4;
}

.cssGrid1-7 {
  grid-column: 1 / span 7;
}

.cssGrid1-11 {
  grid-column: 1 / span 11;
}

.cssGrid1-13 {
  grid-column: 1 / span 13;
}

.cssGrid1-15 {
  grid-column: 1 / span 15;
}

.cssGrid2-3 {
  grid-column: 2 / span 3;
}

.cssGrid2-4 {
  grid-column: 2 / span 4;
}

.cssGrid2-7 {
  grid-column: 2 / span 7;
}

.cssGrid3-2 {
  grid-column: 3 / span 2;
}

.cssGrid3-3 {
  grid-column: 3 / span 3;
}

.cssGrid3-4 {
  grid-column: 3 / span 4;
}

.cssGrid3-6 {
  grid-column: 3 / span 6;
}

.cssGrid4-1 {
  grid-column: 4 / span 1;
}

.cssGrid4-2 {
  grid-column: 4 / span 2;
  text-align: center;
}

.cssGrid4-2-izq {
  grid-column: 4 / span 2;
}

.cssGrid4-3 {
  grid-column: 4 / span 3;
  text-align: center;
}

.cssGrid4-3-izq {
  grid-column: 4 / span 3;
}

.cssGrid4-5 {
  grid-column: 4 / span 5;
}

.cssGrid4-13 {
  grid-column: 4 / span 13;
}

.cssGrid5-1 {
  grid-column: 5 / span 1;
}

.cssGrid5-2 {
  grid-column: 5 / span 2;
}

.cssGrid5-3 {
  grid-column: 5 / span 3;
}

.cssGrid5-4 {
  grid-column: 5 / span 4;
}

.cssGrid5-8 {
  grid-column: 5 / span 8;
}

.cssGrid6-1 {
  grid-column: 6 / span 1;
}

.cssGrid6-2 {
  grid-column: 6 / span 2;
}

.cssGrid6-3 {
  grid-column: 6 / span 3;
}

.cssGrid7-1 {
  grid-column: 7 / span 1;
}

.cssGrid7-2 {
  grid-column: 7 / span 2;
}

.cssGrid7-3 {
  grid-column: 7 / span 3;
}

.cssGrid8-1 {
  grid-column: 8 / span 1;
}

.cssGrid9-1 {
  grid-column: 9/ span 1;
}

.cssGrid9-2 {
  grid-column: 9 / span 2;
} 

.cssGrid9-3 {
  grid-column: 9 / span 3;
} 

.cssGrid9-4 {
  grid-column: 9 / span 4;
}

.cssGrid9-8 {
  grid-column: 9 / span 8;
}

.cssGrid10-1 {
  grid-column: 10 / span 1;
}

.cssGrid10-2 {
  grid-column: 10 / span 2;
}

.cssGrid11-1 {
  grid-column: 11 / span 1;
}

.cssGrid11-2 {
  grid-column: 11 / span 2;
}

.cssGrid11-3 {
  grid-column: 11 / span 3;
}

.cssGrid12-1 {
  grid-column: 12 / span 1;
}

.cssGrid12-2 {
  grid-column: 12 / span 2;
}

.cssGrid12-3 {
  grid-column: 12 / span 3;
}

.cssGrid13-1 {
  grid-column: 13 / span 1;
}

.cssGrid13-2 {
  grid-column: 13 / span 2;
}

.cssGrid14-1 {
  grid-column: 14 / span 1;
}

.cssGrid14-3 {
  grid-column: 14 / span 3;
}

.cssGrid15-1 {
  grid-column: 15 / span 1;
}

.cssGrid15-2 {
  grid-column: 15 / span 2;
}

.cssGrid16-1 {
  grid-column: 16 / span 1;
}

.cssLabelGrid {
  grid-column: 1 / span 1;
  text-align: left;
}

.cssLabelGrid-8 {
  grid-column: 1 / span 1;
  text-align: left;
}

.cssLabelGrid-12 {
  grid-column: 1 / span 2;
}

.cssInputGrid {
    grid-column: 2 / span 5;
}

.cssInputCodigoGrid {
    grid-column: 2 / span 1;
}

.cssInputCodigoGrid-12 {
  grid-column: 3 / span 1;
}

.cssInputDescGrid-8 {
  grid-column: 2 / span 6;
}

.cssInputDescGrid-12 {
  grid-column: 4 / span 9;
}

.cssInputOtroGrid-12 {
  grid-column: 4 / span 1;
}

.row-card {
    margin: 10px 5px;
}

.table {
  background-color: #fff;
}

.table-responsive {
  overflow-x: auto;
  overflow-y: auto;
}

  .table-responsive td {
    padding-bottom: .1rem;
    padding-top: .1rem;
    vertical-align: middle;
  }

td
{
	height: 20px
}

@media (max-width : 700px) {
    .cssDivLogin {
        /*margin-left: 5px;
        margin-right: 5px;*/
        margin-top: 50px; /*distancia del logo*/  
        max-width: 503px;  
        margin-left: auto;
        margin-right: auto;
    }

    .csslblMsjError {
        /*font-size: 1.2vw;*/
        font-size: 12px;
    }

    .cssImgFlecha {
        margin-left: 37vw;
    }

    .cssDivLoginLogo {
        text-align: center;
    }
}

@media (min-width: 700px) {
    .cssDivLogin {
        /*margin-left: 10vw;
        margin-right: 10vw;*/ 
        margin-top: 100px;/*distancia del logo*/    
        margin-left: auto;
        margin-right: auto;
        max-width: 503px;
    }

    .csslblMsjError {
        /*font-size: 1.2vw;*/
        font-size: 18px;
    }

    .cssImgFlecha {
        margin-left: 45vw;
    }

    .cssDivLoginLogo {
        text-align: right; 
        margin-right: 5px;
    }
}

@media (min-width : 1200px) {
    .cssDivLogin {
        margin-left: auto;
        margin-right: auto;
        /*max-width: 25vw;*/
        max-width: 503px;
    }

    .csslblMsjError { 
        /*font-size: 1.2vw;*/
        font-size: 16px;
    }

    .cssImgFlecha {
        margin-left: 47vw;
    }
}