/*@charset "utf-8";*/
#mensajeCuenta {
    /* Tamaño y color del mensaje de cambio de cuenta */
    color: #5E92C0; /* Color azul claro */
    font-size: 9px;
    margin: 10px 0px 10px 5px; /* Margen superior e inferior de 10px, margen izquierdo de 5px */
    font-weight: bold;
}

.rowsHeader {
    font-family: Arial;
    color: #33CCFF;
    font-size: medium;
}

.rowssFooter {
    font-family: Arial;
    color: Black;
    font-size: small;
    font: bold;
}

.rowsDataImpar {
    font-family: Arial;
    color: Gray;
    background-color: #EAEAEA;
}

.breakWord {
    word-wrap: break-word;
}

/* CSS Document */
/*
*/
/* ESTILOS COMUNES A TODAS LAS PÁGINAS	*/
#contenedor {
    /* Todo el contenido va entre estas etiquetas para que quede centrado todo */
    margin-left: auto;
    margin-right: auto;
    width: 600px;
}

#contenedorSinMenu {
    /* Todo el contenido va entre estas etiquetas para que quede centrado todo */
    margin-left: auto;
    margin-right: auto;
    width: 670px;
}

body {
    /* Todas las páginas llevan por defecto Arial como fuente principal, 11 de tamaño y color gris */
    color: #606060;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    margin-top: 0px;
    margin-bottom: 0px;
}

a {
    /* Los links por defecto van a tener este tono de azul */
    color: #2D4B84;
}

h1 {
    /* A ser usado como título en las páginas: Arial (por defecto en el body), tamamño 14 */
    color: #929292;
    font-size: 14px;
    margin: 0px;
    width: 262px;
    height: 16px;
}

    h1 .activo {
        /* Indica sub-sección en los títulos, representada con el color naranja  							está para ser usado en conjunto con h1. Del h1 se hereda el tipo de fuente (arial) 							y el tamaño 14px */
        color: #DEB406;
    }

h2 {
    /* con h2 definimos los sub-títulos. Por ejemplo, los títulos de las tablas */
    color: #5E92C0; /* Color azul claro */
    font-size: 12px;
    margin: 10px 0px 10px 5px; /* Margen superior e inferior de 10px, margen izquierdo de 5px */
    font-weight: bold;
    text-align: center;
}

h3 {
    /* con h3 definimos los títulos de 3er nivel. Por ejemplo los títulos de las tablas 							en la página de consultas */
    color: #717171;
    font-size: 12px;
    font-weight: bold;
    margin: 0px;
    padding: 0px 0px 5px 0px;
}

#herramientas {
    /* Para colocar los enlaces de Seguridad, Ayuda, etc...  							la fuente por defecto es Arial que viene del body, tamaño 10px */
    font-size: 10px;
    width: 292px;
}

    #herramientas a {
        /* Establece el gris en los enlaces del menú de herramientas */
        color: #717171;
    }
/* Menú principal 
		Este menú se compone de dos partes, según los dos niveles de navegación que hay.
	 	La primera parte corresponde al primer nivel de navegación. 
  	 	Está diseñado para ser usado sobre una tabla de una columna. 
*/
.tdMenu {
    border-bottom: dashed #FFFFFF 1px; /* Cada celda se separa una de otra por un borde blanco de puntos. */
    padding: 0px; /* Cada uno de los elementos de la lista tienen una separación entre sí */
    width: 139px;
}

.menu a {
    /* este estilo es el que define todo el estilo del botón */
    color: #2D4B84;
    font-size: 12px;
    font-weight: bold;
    text-decoration: none;
    display: block; /* Display Block para que el botón se active completo y no sólo el texto */
    background-image: none;
    padding: 5px 5px 5px 20px; /* Este estilo da los márgenes que requiere el botón, incluyendo 20px a la izq. */
}

.menu .activo {
    /* Este estilo se coloca en el enlace que corresponda a la sección activa. */ /* También debe colocarse en el TD de la sección activa */
    background-image: url(../images/fondo-menu-internas.gif); /* La sección activa de define con una banda azul a la dercha */
    background-repeat: repeat-y;
}

.activoBarraAzul {
    /* Este estilo se coloca en el enlace que corresponda a la sección activa. */ /* También debe colocarse en el TD de la sección activa */
    background-image: url(../images/fondo-menu-internas.gif); /* La sección activa de define con una banda azul a la dercha */
    background-repeat: repeat-y;
    border-bottom: dashed #FFFFFF 1px; /* Cada celda se separa una de otra por un borde blanco de puntos. */
    padding: 0px; /* Cada uno de los elementos de la lista tienen una separación entre sí */
}


.menu a:hover {
    /* Efecto de rollover al botón: aparece una franja azul a la izquierda. */
    background-image: url(../images/fondo-menu-internas.gif);
    background-repeat: repeat-y;
}
/* Segunda parte del menú - segundo nivel */
.menuSec {
    /* El color por defecto de la fuente es azul */
    color: #5E92C0;
}

    .menuSec ul {
        /* El menú secundario se forma con listas (UL).  */
        list-style: none; /* No tiene estilo de bullet */
        margin: 0px 0px 0px 10px; /* Se les deja en 0 los margenes que trae por defecto y se coloca el izq en 10 */
        padding: 0px 8px 10px 12px; /* Se le deja en 0 el padding que tiene por defecto y se le dan los espacios que requeire */
    }

    .menuSec li {
        padding: 5px 0px 5px 10px; /* Cada uno de los elementos de la lista tienen una separación entre sí */
    }

    .menuSec a {
        /* Con este estilo se quita los estilos del menú principal que se arrastra por defecto */
        color: #606060;
        font-size: 11px;
        font-weight: normal;
        padding: 0px;
        margin: 0px;
    }

        .menuSec a:hover {
            /* al pasar el mouse por encima, los enlaces cambian de color */
            color: #5E92C0;
            background: none;
        }

    .menuSec .activoSec {
        /* este estilo indica la sub-sección que se encuentra actualmente                                    se aplica sobre el li. 								   Ejemplo: <li class="activoSec">Cuenta Corriente</li> */
        color: #5E92C0;
        background-image: url(../images/images-flechaAzul.gif);
        background-repeat: no-repeat;
        background-position: center left;
    }
        /* Añadido por Iván Márquez para permitir Link en el menú seleccionado */
        .menuSec .activoSec a {
            /* Con este estilo se quita los estilos del menú principal que se arrastra por defecto */
            color: #5E92C0;
        }

.activoSec {
    /* este estilo indica la sub-sección que se encuentra actualmente                                    se aplica sobre el li. 								   Ejemplo: <li class="activoSec">Cuenta Corriente</li> */
    color: #5E92C0;
    background-image: url(../images/images-flechaAzul.gif);
    background-repeat: no-repeat;
    background-position: center left;
}
/**/
#contenido_internas {
    /* Establece un margen de separación a la izquierda del contenido */
    padding-left: 15px;
}

#pie {
    /* Estilo del pie de página de la página de ingreso  						   se aplica a toda la tabla, por ello es que se inluye un margen superior de 15px 						   color gris y fuente de 10px. El arial se hereda del body */
    color: #717171;
    font-size: 10px;
    padding-top: 15px;
}

    #pie p {
        /* No hay espacio entre los párrafos del pie de página */
        margin: 0px;
    }

#piegeneral {
    /* Estilos para el pie del resto de las páginas 							se aplica a toda la tabla y por ello se inlcuyen márgenes 							se agregó al estilo la linea gris superior que divide el pie del contenido */
    color: #717171;
    font-size: 10px;
    padding-top: 15px;
    padding-left: 20px;
    border-top: solid 1px #e7e7e7;
}

    #piegeneral p {
        /* el pie tiene espacio 0 entre párrafos */
        margin: 0px;
    }

input {
    /* Estilo por defecto de los cuadros de entrada de texto de los formularios 							heredan el Arial del body, se les asignó 11px de tamaño y gris de color de fuente */
    font-size: 11px;
    color: #666666;
    margin-left: 3px;
    margin-bottom: 0px;
    padding-top: 2px !important;
}

select {
}

textarea {
    /* Estilo por defecto de los cuadros de entrada de texto de los formularios 							heredan el Arial del body, se les asignó 11px de tamaño y gris de color de fuente */
    font-size: 11px;
    color: #666666;
    margin-left: 3px;
    margin-bottom: 0px;
    font-family: Arial;
}

.texto-obligatorio {
    /* usasdo para campos obligatorios */ /*color:#E1BA06;*/ /* Naranja */
    color: #0D1F4F;
    font-weight: bold;
    font-size: 16px;
    text-align: center;
}


.texto-bold {
    /* Reemplazo del <strong> */
    font-weight: bold;
}

.texto-naranja {
    color: #BF6000;
    font-weight: bold;
    font-size: 12px;
}

.texto-azul {
    color: #5E92C0;
}
/* 	Botón estándard usado en la página 
	el botón se arma con dos elementos: el <div> y el <a>
	el estilo del <div> define la esquina izquierda
	y el estilo del <a> define la esquina derecha 
	así podemos hacer botones variando su contenido
	mientras tengan una sola línea 
	ejemplo de uso: 
	<div id="boton"><a href="#">Aceptar</a></div>
*/
#boton {
    background-image: url(../images/bot-izq.gif);
    background-repeat: no-repeat;
    background-position: left;
    padding: 5px 0px 5px 3px;
}

    #boton a {
        color: #EBEBEB;
        font-size: 11px;
        font-weight: bold;
        text-decoration: none;
        background-image: url(../images/bot-der.gif);
        background-repeat: no-repeat;
        background-position: right;
        padding: 5px 23px 5px 20px;
    }

#boton-amarillo {
    background-image: url(../images/bot-amarillo-izq.gif);
    background-repeat: no-repeat;
    background-position: left;
    padding: 5px 0px 5px 3px;
}

    #boton-amarillo a {
        color: #000;
        font-size: 11px;
        font-weight: bold;
        text-decoration: none;
        background-image: url(../images/bot-amarillo-der.gif);
        background-repeat: no-repeat;
        background-position: right;
        padding: 5px 23px 5px 20px;
    }

#boton_largo {
    background-image: url(../images/bot-izq.gif);
    background-repeat: no-repeat;
    background-position: left;
    padding: 5px 0px 5px 3px;
}

    #boton_largo a {
        color: #EBEBEB;
        font-size: 11px;
        font-weight: bold;
        text-decoration: none;
        background-image: url(../images/bot-der-largo.gif);
        background-repeat: no-repeat;
        background-position: right;
        padding: 5px 23px 5px 20px;
    }

.cabfecha {
    /* En la cabecera de todas las páginas salvo el ingreso aparece la fecha del día.  								este estilo se aplica al td. Color gris-azulado, centrado en el cuadro, a 9px 								la fuente se hereda del body (arial) */
    color: #5E92C0;
    font-size: 9px;
    text-align: center;
}

.cabnombre {
    /* En la cabecera de todas las páginas salvo el ingreso llevan el nombre del usuario 								este estilo se aplica al td y define color gris-azulado, el tamaño de la fuente y el bold.  								El resto del estilo (Arial) se hereda del body. */
    color: #5E92C0;
    font-size: 12px;
    font-weight: bold;
}
/* ESTILOS PARA EL INGRESO	
La estructura de la página de ingreso es la siguiente:
________________________________
|      cabecera                |	Cabecera con el logo - no tiene ningún estilo en particular
--------------------------------
|       top ingreso            |	Esta zona contiene el título de la página, el menú de herramientas y el degradé de fondo. 
--------------------------------
         contenido libre			Aquí viene el contenido
-------------------------------
|        bottom ingreso        |	Esta zona contiene los términos y condiciones y el degradé decorativo de fondo
--------------------------------
|        pie				   |	Esa zona contiene la información del pie de página. 
--------------------------------

*/

#topingreso {
    /* Se define que el fondo decorativo se repita solo en x, y el margen que lleva 										esa zona (arriba 20, derecha 23px, abajo 20px, izquierda 23px)  */
    background-repeat: repeat-x;
    padding: 20px 23px 20px 23px;
}

#bottomingreso {
    /* Se define que el fondo decorativo se repite en x y que se alinea abajo y los 								espacios que se requieren para esta zona (arriba 20, derecha 30px, abajo 8px, izquierda 12px) */
    background-repeat: repeat-x;
    background-position: 50% bottom;
    padding: 20px 30px 8px 12px;
    width: 670px;
}
/* estilo del Teclado	*/
/* El teclado está construido con las letras en hmtl y 
   únicamente los fondos son imágenes. El rollover se hace
   utilizando la hoja de estilos. Esto nos permite cargar sólo
   dos imágenes para armar el teclado en lugar de todas
   las teclas correspondientes a cada letra o número.
   El espaciado a la iquierda de cada grupo de teclas
   se realiza con celdas de tablas en el código. 
   Ejemplo: <div id="teclado"><a href="#">7</a><a href="#">8</a></div>
*/

#fondoteclado {
    padding-top: 10px;
    border-top: 1px solid #DDDDDD;
    background-image: url('../images/fondo-teclado-empresas.gif');
    padding-bottom: 5px;
    width: 77%;
}

#teclado {
    /* Define un espacio superior de 10px para el bloque completo de teclas,  									una línea azul en la parte superior del teclado, al igual que un fondo 									que se alinea abajo a la derecha. El teclado tiene un margen inferior de 5px */
    padding-top: 10px; /*border-top:1px solid #DDDDDD;*/
    background-position: right bottom;
    padding-bottom: 5px;
    width: 99%;
    height: 118px;
}

#fondoteclado {
    padding-top: 10px;
    border-top: 1px solid #DDDDDD;
    background-image: url('../images/fondo-teclado-empresas.gif');
    padding-bottom: 5px;
    width: 77%;
}


#teclado a {
    /* Cada tecla hereda su estilo al colocar el enlace "a" */
    color: #525252; /*La letra toma un color gris en bold, sin subrayado.*/
    font-weight: bold;
    font-size: 15px;
    text-decoration: none;
    background-image: url('../images/bot-teclado.gif'); /*Toma automáticamente el fondo que le da el volumen al botón,*/
    background-repeat: no-repeat;
    width: 26px; /* se define un ancho fijo de 20px y un alto de 17px*/
    height: 23px;
    display: block; /* se despliega la información como bloque para que el enlace*/ /* no se marque sólo en en número sino en todo el ancho del botón, */
    float: left; /* se pone a flotar a la izquierda para que las teclas se apilen*/ /* unas al lado de las otras y se alinea el texto al centro. */
    padding-top: 4px;
    text-align: center;
}

    #teclado a:hover {
        background-image: url(../images/bot-teclado_f2.gif); /* se cambia el fondo cuando se hace rollover sobre el enlace */
    }

    #teclado a.final {
        border-right: solid 1px #999999;
        margin-left: 0px;
    }

    #teclado a.bottom {
        border-bottom: solid 1px #999999;
        margin-left: 0px;
    }

    #teclado a.borrar {
        border-bottom: solid 1px #999999;
        border-right: solid 1px #999999;
        margin-left: 0px;
        background-image: url('../images/bot-borrarmodf.gif');
        width: 52px; /* se define un ancho fijo de 20px y un alto de 17px*/
        height: 23px;
    }

        #teclado a.borrar:hover {
            background-image: url(../images/bot-borrarmodif_f2.gif); /* se cambia el fondo cuando se hace rollover sobre el enlace */
        }


/*Estilos para el teclado Factor 2 */
#tecladof2 {
    /* Define un espacio superior de 10px para el bloque completo de teclas,  									una línea azul en la parte superior del teclado, al igual que un fondo 									que se alinea abajo a la derecha. El teclado tiene un margen inferior de 5px */
    padding-top: 10px; /*border-top:1px solid #DDDDDD;*/
    background-position: right bottom;
    padding-bottom: 5px;
    width: 99%;
    height: 118px;
}

    #tecladof2 a {
        /* Cada tecla hereda su estilo al colocar el enlace "a" */
        color: #525252; /*La letra toma un color gris en bold, sin subrayado.*/
        font-weight: bold;
        font-size: 14px;
        text-decoration: none;
        background-image: url('../images/bot-teclado.gif'); /*Toma automáticamente el fondo que le da el volumen al botón,*/
        background-repeat: no-repeat;
        width: 26px; /* se define un ancho fijo de 20px y un alto de 17px*/
        height: 23px;
        display: block; /* se despliega la información como bloque para que el enlace*/ /* no se marque sólo en en número sino en todo el ancho del botón, */
        float: left; /* se pone a flotar a la izquierda para que las teclas se apilen*/ /* unas al lado de las otras y se alinea el texto al centro. */
        padding-top: 4px;
        text-align: center;
    }

        #tecladof2 a:hover {
            background-image: url(../images/bot-teclado_f2.gif); /* se cambia el fondo cuando se hace rollover sobre el enlace */
        }

        #tecladof2 a.final {
            border-right: solid 1px #999999;
            margin-left: 0px;
        }

        #tecladof2 a.TecladoNumerico {
        }

        #tecladof2 a.bottom {
            border-bottom: solid 1px #999999;
            margin-left: 0px;
        }

        #tecladof2 a.borrar {
            border-bottom: solid 1px #999999;
            border-right: solid 1px #999999;
            margin-left: 0px;
            background-image: url('../images/bot-borrarmodf.gif');
            width: 52px; /* se define un ancho fijo de 20px y un alto de 17px*/
            height: 23px;
        }

            #tecladof2 a.borrar:hover {
                background-image: url(../images/bot-borrarmodif_f2.gif); /* se cambia el fondo cuando se hace rollover sobre el enlace */
            }

/* ESTILOS PARA EL CONSOLIDADO*/
/* Tabla del consolidado 
	Para formar la tabla se deben colocar los siguientes estilos:
	- tabla_consolidado a la tabla que va a contener toda la información. 
	  Ej: <table width="100%" border="0" cellpadding="0" cellspacing="0" class="tabla_consolidado">
	- La primera fila de la tabla se debe definir como cabecera de columna. (Usar "th" en lugar de "td").
	  Ej: <th width="15%" scope="col">Tipo</th>
	- Se define el estilo de las filas pares en el TR que corresponda. 
	  Ej:  <tr class="par">
	- Se define en todas las celdas de la última columna el estilo ".saldo" para que queden a la dercha
	  Ej: <td class="saldo">1.365,22</td> 
	  Ej: <th class="saldo" scope="col">Saldo Disponible</th>
	- Se define el estilo para la última fila llamado ".final"
	  Ej: <tr class="final">
*/

.tabla_consolidado {
    border-top: solid 1px #5E92C0; /* Borde azul al principio de la tabla */
}

    .tabla_consolidado th {
        /* Estilo de la primera fila de la tabla */
        color: #5E92C0; /* Textos azules */
        font-size: 12px; /* Tamaño de fuente */
        font-weight: normal; /* Le quitamos el bold por defecto del estilo */
        text-align: left; /* Le quitamos el alineado central de los textos */
        padding: 8px; /* Espacio interno de las celdas */
        padding-left: 5px;
        border-bottom: 1px solid #DDDDDD; /* Borde gris inferior */
    }

    .tabla_consolidado td {
        /* Definición de todas las celdas de la tabla  */
        padding: 5px;
        border-bottom: 1px solid #DDDDDD;
    }

    .tabla_consolidado .final {
        /* Definición de la última fila */
        font-weight: bold;
        color: #373737;
    }

    .tabla_consolidado .par {
        /* Estilo para las filas pares de la tabla */
        background-color: #F1F1F1;
    }

    .tabla_consolidado .saldo {
        /* Estilo para la columna de saldo */
        text-align: right; /* Los textos alienados a la dercha */
        padding-right: 20px; /* Espacio adicional a la derecha */
    }
/* ESTILOS PARA CONSULTAS */
.bordeizq {
    border-left: solid 1px #D6D6D6;
}

.bordertop {
    border-top: solid 1px #D6D6D6;
}

.tabla-consulta {
    border-left: solid 1px #D6D6D6;
    border-bottom: solid 1px #D6D6D6;
    border-right: none;
    background-image: url(../images/fondo-cuentas.gif);
    background-repeat: repeat-x;
    background-position: bottom;
    padding-left: 10px;
    padding-right: 10px;
}

.listaConsulta {
    /* Estilo del drop-down list para las cuentas */
    font-size: 10px;
    color: #666666;
    margin-left: 3px;
    margin-bottom: 0px;
    padding: 1px 0px;
}

.numeronuevo {
    /* Estilo del drop-down list para las cuentas */
    font-size: 10px;
    color: #666666;
    margin-left: 3px;
}

.radio-consulta {
    margin: 0px;
    padding: 0px;
}

.tabla-balance {
    border-top: solid 1px #5E92C0; /* linea azul sobre la tabla */
    border-bottom: solid 1px #D6D6D6; /* linea gris que termina la tabla */
}

    .tabla-balance td {
        padding: 5px; /* espaciado entre las celdas de la tabla */
    }

    .tabla-balance .par {
        /* se aplica sobre las filas pares */
        background-color: #F1F1F1;
    }

    .tabla-balance .final {
        /* Definición de la última fila */
        font-weight: bold;
        color: #373737;
    }

    .tabla-balance .saldo {
        /* Estilo para la columna de saldo */
        text-align: right; /* Los textos alienados a la dercha */
        padding-right: 20px; /* Espacio adicional a la derecha */
    }
/* Tabla de movimientos 
	Para formar la tabla se deben colocar los siguientes estilos:
	- tabla-movimiento a la tabla que va a contener toda la información
	- La primera fila de la tabla se debe definir como cabecera de columna. (Usar "th" en lugar de "td")
	- Se define el estilo de las filas pares en el TR que corresponda
	- Se define en todas las celdas de la última columna el estilo ".saldo" para que queden a 
	- Se define el estilo para la última fila llamado ".final
*/


.tabla-movimientosHeaderRight {
    border-top: solid 1px #5E92C0; /* Borde azul al principio de la tabla */
}


    .tabla-movimientosHeaderRight th {
        /* Estilo de la primera fila de la tabla */
        color: #5E92C0; /* Textos azules */
        font-size: 12px; /* Tamaño de fuente */
        font-weight: bold; /* Bold  */
        padding: 8px; /* Espacio interno de las celdas */
        padding-left: 5px;
        border-bottom: 1px solid #DDDDDD; /* Borde gris inferior */
    }

    .tabla-movimientosHeaderRight td {
        /* Definición de todas las celdas de la tabla  */
        padding: 5px;
        text-align: center;
        border-bottom: 1px solid #DDDDDD;
    }

    .tabla-movimientosHeaderRight .totales {
        /* Estilo para la fila de "totales" y de "vienen" */
        font-weight: bold;
        color: #373737;
        background-color: #F5F7FB; /* Fondo azul */
    }

    .tabla-movimientosHeaderRight .par {
        /* Estilo para las filas pares de la tabla */
        background-color: #F1F1F1;
    }

    .tabla-movimientosHeaderRight .saldo {
        /* Estilo para la columna de saldos debitos y créditos */
        text-align: right; /* Los textos alienados a la dercha */
        padding-right: 10px; /* Espacio adicional a la derecha */
    }

    .tabla-movimientosHeaderRight .monto {
        /* Estilo para la columna de saldos debitos y créditos */
        text-align: right; /* Los textos alienados a la dercha */
        padding-right: 10px; /* Espacio adicional a la derecha */
    }

.tabla-movimientos {
    border-top: solid 1px #5E92C0; /* Borde azul al principio de la tabla */
    table-layout: fixed;
    border-bottom: 1px solid #DDDDDD;
}

    .tabla-movimientos th {
        /* Estilo de la primera fila de la tabla */
        color: #5E92C0; /* Textos azules */
        font-size: 12px; /* Tamaño de fuente */
        font-weight: bold; /* Bold  */
        text-align: left; /* Le quitamos el alineado central de los textos */
        padding: 8px; /* Espacio interno de las celdas padding-left:5px;*/
    }

    .tabla-movimientos td {
        /* Definición de todas las celdas de la tabla  */
        padding: 5px;
    }

    .tabla-movimientos .totales {
        /* Estilo para la fila de "totales" y de "vienen" */
        font-weight: bold;
        color: #373737;
        background-color: #F5F7FB; /* Fondo azul */
    }

    .tabla-movimientos .par {
        /* Estilo para las filas pares de la tabla */
        background-color: #F1F1F1;
    }

    .tabla-movimientos .saldo {
        /* Estilo para la columna de saldos debitos y créditos */
        text-align: right; /* Los textos alienados a la dercha */ /* Espacio adicional a la derecha padding-right:10px;*/
    }


/**/
.tabla-movimientos1 {
    border-top: solid 1px #5E92C0; /* Borde azul al principio de la tabla */ /*table-layout:fixed;*/
}

    .tabla-movimientos1 th {
        /* Estilo de la primera fila de la tabla */
        color: #5E92C0; /* Textos azules */
        font-size: 12px; /* Tamaño de fuente */
        font-weight: bold; /* Bold  */
        text-align: left; /* Le quitamos el alineado central de los textos */
        padding: 8px; /* Espacio interno de las celdas padding-left:5px;*/
        border-bottom: 1px solid #DDDDDD; /* Borde gris inferior */
    }

    .tabla-movimientos1 td {
        /* Definición de todas las celdas de la tabla  */
        padding: 5px;
        border-bottom: 1px solid #DDDDDD;
    }

    .tabla-movimientos1 .totales {
        /* Estilo para la fila de "totales" y de "vienen" */
        font-weight: bold;
        color: #373737;
        background-color: #F5F7FB; /* Fondo azul */
    }

    .tabla-movimientos1 .par {
        /* Estilo para las filas pares de la tabla */
        background-color: #F1F1F1;
    }

    .tabla-movimientos1 .saldo {
        /* Estilo para la columna de saldos debitos y créditos */
        text-align: right; /* Los textos alienados a la dercha */ /* Espacio adicional a la derecha padding-right:10px;*/
    }






.tabla-movimientos2 {
    /*border-top: solid 1px #5E92C0;  Borde azul al principio de la tabla */
    /*table-layout: fixed;*/
}

    .tabla-movimientos2 th {
        /* Estilo de la primera fila de la tabla */
        color: #5E92C0; /* Textos azules */
        font-size: 12px; /* Tamaño de fuente */
        font-weight: bold; /* Bold  */
        text-align: left; /* Le quitamos el alineado central de los textos */
        padding: 8px; /* Espacio interno de las celdas padding-left:5px;*/
        border-bottom: 1px solid #DDDDDD; /* Borde gris inferior */
    }

    .tabla-movimientos2 td {
        /* Definición de todas las celdas de la tabla  */
        padding: 5px;
    }

        .tabla-movimientos2 td .chks {
            /* Definición de todas las celdas de checkbox  */
            padding: 5px 0px 5px 0px;
            width: 15px;
            text-align: center;
        }

            .tabla-movimientos2 td .chks input {
                margin-left: 0px;
            }

        .tabla-movimientos2 td .shortlbl {
            /* Definición de todas las celdas de etiquetas cortas  */
            width: 50px;
            text-align: left;
        }

        .tabla-movimientos2 td .longlbl {
            /* Definición de todas las celdas de etiquetas cortas  */
            width: 70px;
            text-align: left;
        }

    .tabla-movimientos2 .totales {
        /* Estilo para la fila de "totales" y de "vienen" */
        font-weight: bold;
        color: #373737;
        background-color: #F5F7FB; /* Fondo azul */
    }

    .tabla-movimientos2 .par {
        /* Estilo para las filas pares de la tabla */
        background-color: #F1F1F1;
    }

    .tabla-movimientos2 .saldo {
        /* Estilo para la columna de saldos debitos y créditos */
        text-align: right; /* Los textos alienados a la dercha */ /* Espacio adicional a la derecha padding-right:10px;*/
    }

.tabla-movimientos3 {
    border-top: solid 1px #5E92C0; /* Borde azul al principio de la tabla */
    table-layout: fixed;
}

    .tabla-movimientos3 th {
        /* Estilo de la primera fila de la tabla */
        color: #5E92C0; /* Textos azules */
        font-size: 12px; /* Tamaño de fuente */
        font-weight: bold; /* Bold  */
        text-align: left; /* Le quitamos el alineado central de los textos */
        padding: 8px; /* Espacio interno de las celdas padding-left:5px;*/
        border-bottom: 1px solid #DDDDDD; /* Borde gris inferior */
    }

    .tabla-movimientos3 td {
        /* Definición de todas las celdas de la tabla  */
        padding: 5px;
    }


        .tabla-movimientos3 td .chks {
            /* Definición de todas las celdas de checkbox  */
            padding: 5px 0px 5px 0px;
            width: 15px;
            text-align: center;
        }

            .tabla-movimientos3 td .chks input {
                margin-left: 0px;
            }

        .tabla-movimientos3 td .shortlbl {
            /* Definición de todas las celdas de etiquetas cortas  */
            width: 50px;
            text-align: left;
        }

        .tabla-movimientos3 td .longlbl {
            /* Definición de todas las celdas de etiquetas cortas  */
            width: 70px;
            text-align: left;
        }

    .tabla-movimientos3 .totales {
        /* Estilo para la fila de "totales" y de "vienen" */
        font-weight: bold;
        color: #373737;
        background-color: #F5F7FB; /* Fondo azul */
    }

    .tabla-movimientos3 .par {
        /* Estilo para las filas pares de la tabla */
        background-color: #F1F1F1;
    }

    .tabla-movimientos3 .saldo {
        /* Estilo para la columna de saldos debitos y créditos */
        text-align: right; /* Los textos alienados a la dercha */ /* Espacio adicional a la derecha padding-right:10px;*/
    }
/**/



/* Tabla de movimientos para la tabla de consulta movimientos
	Para formar la tabla se deben colocar los siguientes estilos:
	- tabla-movimiento a la tabla que va a contener toda la información
	- La primera fila de la tabla se debe definir como cabecera de columna. (Usar "th" en lugar de "td")
	- Se define el estilo de las filas pares en el TR que corresponda
	- Se define en todas las celdas de la última columna el estilo ".saldo" para que queden a 
	- Se define el estilo para la última fila llamado ".final
*/
.tabla-movimientosConsolidado {
    border-top: solid 1px #5E92C0; /* Borde azul al principio de la tabla */ /*table-layout:fixed;*/
}

    .tabla-movimientosConsolidado th {
        /* Estilo de la primera fila de la tabla */
        color: #5E92C0; /* Textos azules */
        font-size: 12px; /* Tamaño de fuente */
        font-weight: bold; /* Bold  */ /*text-align:left;				/* Le quitamos el alineado central de los textos */
        padding: 8px; /* Espacio interno de las celdas padding-left:5px;*/
        border-bottom: 1px solid #DDDDDD; /* Borde gris inferior */
    }

    .tabla-movimientosConsolidado td {
        /* Definición de todas las celdas de la tabla  */
        padding: 5px;
        border-bottom: 1px solid #DDDDDD;
    }

    .tabla-movimientosConsolidado .totales {
        /* Estilo para la fila de "totales" y de "vienen" */
        font-weight: bold;
        color: #373737;
        background-color: #F5F7FB; /* Fondo azul */
    }

    .tabla-movimientosConsolidado .par {
        /* Estilo para las filas pares de la tabla */
        background-color: #F1F1F1;
    }

    .tabla-movimientosConsolidado .saldo {
        /* Estilo para la columna de saldos debitos y créditos */
        text-align: right; /* Los textos alienados a la dercha */ /* Espacio adicional a la derecha padding-right:10px;*/
    }
/* ESTILOS PARA TRANSFERENCIAS */
.fondo-reg-transf {
    /* fondo para el registro de cuenta en las tranferencias */
    background-image: url(../images/fondo-registro-para-tranferencias.gif);
    background-position: bottom right;
    background-repeat: no-repeat;
}
/* ESTILOS PARA LA TRANSFERENCIA REALIZADA */
.num-confirmacion {
    font-size: 13px;
    font-weight: bold;
    background-color: #EBEBEB;
    /*padding: 5px 10px 5px 10px;*/
}
/* ESTILOS PARA LA TRANSFERENCIA Confirmación de clave */
.fondo-confirm-clave {
    background-image: url('../images/fondo-confirmacion-clave.gif');
    background-repeat: no-repeat;
    background-position: right bottom;
    height: 137px;
}
/* ESTILOS PARA PAGOS TDC */
.monto-a-pagar {
    font-weight: bold;
    text-align: right;
    padding-right: 10px;
}

.SibelButton {
    color: #EBEBEB;
    font-size: 11px;
    font-weight: bold;
    text-decoration: none;
    background-image: url(../images/bot-der.gif);
    background-repeat: no-repeat;
    background-position: right;
    padding: 5px 23px 5px 20px;
}

.texto-azul-bold {
    /* Los links por defecto van a tener este tono de azul */
    color: #2D4B84;
    font-weight: bold;
}

.hr-color-azul {
    color: #2D4B84;
    background-color: #2D4B84;
    height: 1px;
    size: 1;
}

.modalBackground {
    background-color: Gray;
    filter: alpha(opacity=70);
    opacity: 0.7;
}


.modalProgressGreyBackground {
    background: #CCCCCC;
    filter: alpha(opacity=60);
    opacity: 0.6;
}

.modalProgressRedBackground {
    background: Red;
    filter: alpha(opacity=60);
    opacity: 0.6;
}

.modalPopup {
    text-align: center;
    padding-top: 30px;
    border-style: solid;
    border-width: 1px;
    background-color: White;
    width: 300px;
    height: 100px;
}
/* //Producto:PagosMasivos Iter:1 20090715 Isbel Gónzalez.*/
/* Control de subir archivos*/
div.fileinputs {
    position: relative;
}

div.fakefile {
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1;
}

/*input.file {
	position: relative;
	text-align: right;
	-moz-opacity:0;
	filter:alpha(opacity: 0);
	opacity: 0;
	z-index: 2;
    left: 0px;
    bottom: 0px;
    }*/
/* Control de subir archivos omar*/
.SI-FILES-STYLIZED label.cabinet {
    width: 94px;
    height: 24px;
    background: url(../images/BotonExaminar.gif) 0 0 no-repeat;
    display: block;
    overflow: hidden;
    cursor: hand;
}

.SI-FILES-STYLIZED input.file {
    /*position: relative;*/
    width: 76px;
    height: 25px;
    opacity: 0;
    -moz-opacity: 0;
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
}

.texto-azul-h2 {
    font-weight: bold;
}

/** Master Page **/
.tdMenusup {
    background-image: url('../images/fondo-menu.gif');
    background-position: bottom right;
}

.tdMenuback {
    background-image: url('../images/fondo-menu1.gif');
    background-repeat: repeat-y;
}

.tdHeaderRight {
    background: url('../images/header12.png');
    background-repeat: no-repeat;
    background-position: right;
    height: 95px;
}


.classic {
    padding: 0.8em 1em;
}

.custom {
    padding: 0.5em 0.8em 0.8em 2em;
}

* html a:hover {
    background: transparent;
}

.classic {
    background: #FFFFAA;
    border: 1px solid #FFAD33;
}

.critical {
    background: #FFCCAA;
    border: 1px solid #FF3334;
}

.help {
    background: #9FDAEE;
    border: 1px solid #2BB0D7;
}

.info {
    background: #9FDAEE;
    border: 1px solid #2BB0D7;
}

.warning {
    background: #FFFFAA;
    border: 1px solid #FFAD33;
}

.cuadroTexto:blur {
}

.cuadroTexto:focus {
}

.cuadroTexto {
}

#N2T_copy {
    background-color: #333333;
    color: #FFFFFF;
    font-weight: bold;
    font-size: 13px;
    font-family: "Trebuchet MS";
    width: 400px;
    left: 0;
    top: 0;
    padding: 4px;
    position: absolute;
    text-align: left;
    z-index: 20;
    -moz-border-radius: 0 10px 10px 10px;
    filter: progid: DXImageTransform.Microsoft.Alpha(opacity=87);
    -moz-opacity: .87;
    -khtml-opacity: .87;
    opacity: .87;
}


#NT_copy {
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-box-shadow: 5px 5px 8px #CCC;
    -webkit-box-shadow: 5px 5px 8px #CCC;
    box-shadow: 5px 5px 8px #CCC;
    padding: 4px;
    position: absolute;
    text-align: left;
    z-index: 20;
    filter: progid: DXImageTransform.Microsoft.Alpha(opacity=87);
    -moz-opacity: .87;
    -khtml-opacity: .87;
    opacity: .87;
    display: inline;
    position: absolute;
    color: #111;
    border: 2px solid #CCc;
    background: #fff;
    font-size: small;
}

#NT_copyToolbox {
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-box-shadow: 5px 5px 8px #CCC;
    -webkit-box-shadow: 5px 5px 8px #CCC;
    box-shadow: 5px 5px 8px #CCC;
    padding: 4px;
    position: absolute;
    text-align: left;
    z-index: 20;
    filter: progid: DXImageTransform.Microsoft.Alpha(opacity=87);
    -moz-opacity: .87;
    -khtml-opacity: .87;
    opacity: .87;
    display: inline;
    position: absolute;
    color: #111;
    border: 2px solid #CCc;
    background: #fff;
    font-size: small;
}

.TooltipHtml {
    display: none;
}

#simplemodal-overlay {
    background-color: #aaaaaa;
}

#simplemodal-container {
    background-color: #ffffff;
    border: 8px solid #444;
    padding: 12px;
}


.tdHeaderExpiracion {
    background: url('../images/bannerNuevo.png');
    background-repeat: no-repeat;
    background-position: left;
    height: 95px;
}

.tdTopExpiracion {
    background: url('../images/fondo-ingreso-top.gif');
    background-repeat: repeat-x;
    background-position: right;
    height: 54px;
}

.tdBottomExpiracion {
    background: url('../images/fondo-ingreso-bottom.gif');
    background-repeat: repeat-x;
    background-position: right;
    height: 54px;
}

.tdDivision {
    border-top: solid 1px #e7e7e7;
}

.texto-azul-h3 {
    /* con h2 definimos los sub-títulos. Por ejemplo, los títulos de las tablas */
    color: #5E92C0; /* Color azul claro */
    font-size: 12px;
    margin: 1px 0px 1px 0px; /* Margen superior e inferior de 10px, margen izquierdo de 5px */
    font-weight: bold;
}


.tabla_dt {
    border-top: solid 1px #5E92C0; /* Borde azul al principio de la tabla */
    table-layout: fixed;
}

    .tabla_dt th {
        /* Estilo de la primera fila de la tabla */
        color: #5E92C0; /* Textos azules */
        font-size: 12px; /* Tamaño de fuente */
        font-weight: normal; /* Le quitamos el bold por defecto del estilo */
        text-align: left; /* Le quitamos el alineado central de los textos */
        padding: 8px; /* Espacio interno de las celdas */
        padding-left: 5px;
        border-bottom: 1px solid #DDDDDD; /* Borde gris inferior */
    }

    .tabla_dt td {
        /* Definición de todas las celdas de la tabla  */
        /*padding: 5px;*/
        padding-top: 5px;
        padding-bottom: 5px;
        padding-right: 1px;
        padding-right: 1px;
        border-bottom: 1px solid #DDDDDD;
    }

    .tabla_dt .par {
        /* Estilo para las filas pares de la tabla */
        background-color: #F1F1F1;
    }

/* Estipo para el linkbutton de Registro Juridico */
.disabledlinkbuttontext {
    color: #EBEBEB;
    font-size: 11px;
    font-weight: bold;
    text-decoration: none;
    background-image: url(../images/bot-der.gif);
    background-repeat: no-repeat;
    background-position: right;
    padding: 5px 23px 5px 20px;
    cursor: wait;
    display: none;
}

.new_bottomingreso {
    width: 100%;
    height: 40px;
    background-image: url(../images/fondo-ingreso-bottom.gif);
    background-repeat: repeat-x;
    background-position: 50% bottom;
}

#boton {
    background-image: url(../images/bot-izq.gif);
    background-repeat: no-repeat;
    background-position: left;
    padding: 5px 0px 5px 3px;
}

    #boton a {
        color: #EBEBEB;
        font-size: 11px;
        font-weight: bold;
        text-decoration: none;
        background-image: url(../images/bot-der.gif);
        background-repeat: no-repeat;
        background-position: right;
        padding: 5px 23px 5px 20px;
    }

.botonnuevo {
    text-align: center;
}

    .botonnuevo a {
        display: block;
        width: 62px;
    }

.texto-azul-left {
    /* con h2 definimos los sub-títulos. Por ejemplo, los títulos de las tablas */
    color: #5E92C0; /* Color azul claro */
    font-size: 12px;
    margin: 10px 0px 10px 5px; /* Margen superior e inferior de 10px, margen izquierdo de 5px */
    font-weight: bold;
    text-align: center;
}

.nobr {
    white-space: nowrap;
}

.marginleft12 {
    margin-left: 12px;
}

.Altura60 {
    height: 60px;
}

.Altura30 {
    height: 30px;
}

.Ancho75Percent {
    width: 75%;
}

.chbMove label {
    position: relative;
    bottom: 2.4px;
}

/****Otp****/
.otpReintentar {
    background-image: none !important;
}

    .otpReintentar a {
        cursor: no-drop !important;
        background-image: none !important;
        background-color: rgba(110, 137, 173, 0.38);
        color: white;
    }

.otpOcultar {
    display: none !important;
}

.otpReintentar a {
    cursor: no-drop !important;
    background-image: none !important;
    background-color: rgba(110, 137, 173, 0.38);
    color: white;
}

/****Fin Otp****/
#boton.botonAjuste a {
    padding: 5px 18px 5px 16px;
}

h1.tituloh1 {
    width: 100%;
}

.boton100 {
    text-align: center;
}

    .boton100 a {
        display: block;
        width: 100px;
    }



/* ESTILOS PARA SERVICIOS*/
/* Tabla de Servicios 
	Para formar la tabla se deben colocar los siguientes estilos:
	- tabla_servicio a la tabla que va a contener toda la información. 
	  Ej: <table cellpadding="0" cellspacing="0" class="tabla_servicio">
	- La primera fila de la tabla se debe definir como cabecera de columna. (Usar "th" en lugar de "td").
	  Ej: <th width="15%" scope="col">Tipo</th>
	- Se define el estilo de las filas pares en el TR que corresponda. 
	  Ej:  <tr class="par">
	- Se define en todas las celdas de la última columna el estilo ".saldo" para que queden a la dercha
	  Ej: <td class="saldo">1.365,22</td> 
	  Ej: <th class="saldo" scope="col">Saldo Disponible</th>
	- Se define el estilo para la última fila llamado ".final"
	  Ej: <tr class="final">
*/

.tabla_servicio {
    width: 100%;
    border: 0;
    padding: 0;
    border-spacing: 0;
    text-align: left;
}

    .tabla_servicio th {
        background-color: #5E92C0;
        text-align: left;
        color: white;
        padding: 10px 10px !important;
        /*font-size: 14px;*/
    }

.tabla_grid th {
    font-size: 12px;
}

.tabla_grid .dataTables_filter {
    padding-top: 5px;
    padding-bottom: 5px;
    float: left;
}

/*.tabla_grid .grdHeader {
    padding: 5px 10px;
}*/

.tabla_servicio h2 {
    text-align: left;
}

.tabla_servicio .subtitulo {
    width: 100%;
    font-weight: bolder;
}

.tabla_servicio .Descripcion {
    height: 30px;
    width: 21%;
}

.tabla_servicio .Separacion {
    height: 30px;
    width: 10%;
}

.tabla_servicio .espacio {
    height: 30px;
    width: 2%;
}

.tabla_servicio .Datos {
    height: 30px;
    width: 67%;
}