﻿/*
 * Hoja de estilos general de la aplicación.
 */

/* #region ***** ELEMENTOS COMUNES ***** */
/***********************************************************************************************************/
@font-face
{
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto'), local('Roboto-Regular'), url(../Fuentes/RobotoRegular400.woff) format('woff');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

@font-face
{
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: local('Roboto Medium'), local('Roboto-Medium'), url(../Fuentes/RobotoMedium500.woff) format('woff');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

@font-face
{
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    src: local('Roboto Bold'), local('Roboto-Bold'), url(../Fuentes/RobotoBold700.woff) format('woff');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

@font-face
{
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 900;
    src: local('Roboto Black'), local('Roboto-Black'), url(../Fuentes/RobotoBlack900.woff) format('woff');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

html
{
    height: 100%;
}

body
{
    font-family: Roboto, Arial, sans-serif;
    font-size: 14px;
    color: #006CB5;
    height:100%;
}

a
{
    text-decoration: none;
    padding: 1px;
}

a[tabindex!=-1]:focus
{
    border: 1px dotted #006CB5;
    padding: 0px;
}

input[type="text"], input[type="password"], input[type="file"], select, textarea
{
    border: solid 1px #006CB5;
    font-family: Roboto, Arial, sans-serif;
    font-size: 12px;
}

input[type="text"]:focus, input[type="password"]:focus, input[type="file"]:focus, select:focus, textarea:focus,
input[type="checkbox"]:focus
{
    border: 1px solid black;
}

input[type="text"], input[type="password"]
{
    padding: 2px 3px 2px 3px;
    vertical-align: inherit;
}

input[type="text"].Numerico
{
    text-align: right;
}

textarea
{
    font-family: Roboto, Arial, sans-serif;
    padding: 1px 3px 1px 3px;
}

input[type="text"][readonly], input[type="text"][disabled="disabled"],
textarea[readonly], textarea[disabled="disabled"]
{
    background-color: #EFFBFF;
}

input[type="text"].Codigo
{
    text-align: center;
    font-weight: bold;
}

.campo input.NumeroDocumentoIdentificacion
{
    width: 109px !important;
}

table.TablaDatos
{
    border-spacing: 0px 0px;
    border-collapse: collapse;
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    table-layout: fixed;
    width: 99%;
    border: 1px solid #7C7C7C;
}

table.TablaDatos tfoot
{
    border-top: 1px solid #7C7C7C;
}

table.TablaDatos th, table.TablaDatos tfoot tr td
{
    background-color: #006CB5;
    color: #FFFFFF;
    font-weight: 500;
    text-align: left;
    vertical-align: middle;
    padding-left: 5px;
    padding-right: 5px;
    border-left: 1px solid white;
    height: 24px;
    border-bottom: none;
    font-size: 14px;
}
.ContenidoModal table.TablaDatos th, table.TablaDatos tfoot tr td
{
    height:20px;
}

table.TablaDatos tfoot tr td
{
    background-color: #006CB5;
    border-left: 1px solid #7C7C7C;
    border-bottom: 1px solid #7C7C7C;
}

table.TablaDatos td
{
    border-width: 0px;
    border-left: 1px solid #006CB5;
    border-bottom: 1px solid #006CB5;
    height: 20px;
    vertical-align: middle;
    padding-left: 5px;
    padding-right: 5px;
    font-size: 12px;
}

table.TablaDatos td.Fecha
{
    text-align: center;
}

table.TablaDatos td.Importe, table.TablaDatos td.Numero
{
    text-align: right;
}

table.TablaDatos td:first-child, table.TablaDatos th:first-child
{
    border-left: 0px;
}

table.TablaDatos tbody tr:hover
{
    background-color: #E6E6E6;
}

table.TablaDatos tr.FilaPar
{
    background-color: #FAFAFA;
}

table.TablaDatos tr[onclick]
{
    cursor: pointer;
}

input, textarea
{
    color: #000000;
}

select
{
    color: #000000;
    height: 22px;
}

select[disabled]
{
    background-color: #EFFBFF;
}

a.Enlace
{
    font-size: 14px;  
    color: #000000;
    vertical-align: bottom;
    margin-top: 4px;
    font-size:12px;
    display: inline-block;
    font-weight:bold;
}

a.Enlace:hover
{
    text-decoration: underline;
}


span.ValorNoEditable
{
    padding-top:4px;
    display:inline-block;
    color: #000000;
    font-size: 12px;
    vertical-align: top;
}

p.pConMargen
{
    margin-top:3px;
}

/***********************************************************************************************************/
/*#endregion*/

/* #region ***** CONTENIDO PRINCIPAL *****/
/***********************************************************************************************************/

div.Contenido
{
    background-color: #FAFAFA;
    border: 2px solid #006CB5;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    min-width: 1102px;
    max-width: 1033px;
}

div.Contenido h1, .Contenido h2
{
    background-color: #006CB5;
    font-weight: bold;
    color: #FFFFFF;
    font-size: 15px;
    margin: 0;
    margin-bottom: 10px;
    padding-bottom: 4px;
    padding-left: 4px;
    padding-top: 4px;
}

div.Contenido h2
{
    margin-top: 10px;
}

div.ContenidoModal
{
    background-color: #FAFAFA;
    padding-top: 7px;
    padding-bottom: 10px;
}

/***********************************************************************************************************/
/*#endregion*/

/* #region ***** CAMPOS DE FORMULARIO *****/
/***********************************************************************************************************/

.campo
{
    display: inline-block;
    margin: 5px;
    vertical-align: top;
    width: 330px;
}

.campoLargo
{
    display: inline-block;
    margin: 5px;
    vertical-align: top;
    width: 672px;
    line-height: 11px;
}

.campoExtraLargo
{
    display: inline-block;
    margin: 5px;
    vertical-align: top;
    width: 1018px;
}

.campo.Oculto, .campoLargo.Oculto, .campoExtraLargo.Oculto, input.Oculto,div.Oculto
{
    display: none;
}

.campo label.Etiqueta, .campoLargo label.Etiqueta, .campoExtraLargo label.Etiqueta,
.campo span.Etiqueta, .campoLargo span.Etiqueta, .campoExtraLargo span.Etiqueta
{
    display: inline-block;
    padding-top: 4px;
    vertical-align: top;
    width: 150px;
    text-align: right;
    font-size: 13px;
}

.campo input[type="checkbox"]
{
    text-align: left;
    width: 15px;
    padding: 3px 0px 0px 0px;
    margin: 0px;
    margin-top: 4px;
}

.campo input, .campo textarea
{
    width: 109px;
}

.campo select
{
    width: 118px;
}

.ContenedorNivel3 .campo, .ContenedorNivel3 .campoLargo, .ContenedorNivel3 .campoExtraLargo
{
    margin-left: 2px;
    margin-right: 8px;
}

.campoLargo input, .campoLargo textarea
{
    width: 453px;
}

.campoLargo input[type="file"]
{
    width: 461px;
}

.campoLargo select /*, .campoLargo table*/
{
    width: 461px;
}

.campoExtraLargo input[type=text], .campoExtraLargo textarea
{
    width: 796px;
}

.campoExtraLargo select
{
    width: 804px;
}

.campo input[type=checkbox], .campo input[type=radio],
.campoLargo input[type=checkbox], .campoLargo input[type=radio],
.campoExtraLargo input[type=checkbox], .campoExtraLargo input[type=radio]
{
    width: 16px;
}

.campoExtraLargo span.Obrigatorio,
.campoLargo span.Obrigatorio,
.campo span.Obrigatorio,
.campoAmpliable span.Obrigatorio
{
    display: none;
}

/***********************************************************************************************************/
/*#endregion*/

/* #region ***** CONTROL CALENDARIO *****/
/***********************************************************************************************************/

.ControlData .ajax__calendar .ajax__calendar_container
{
    border-color: #006CB5;
}

.ControlData .ajax__calendar_container
{
    background-color: #E2E2E2;
    border: solid 1px #006CB5;
    padding: 0px;
}

.ControlData .ajax__calendar_header
{
    background-color: #006CB5;
    color: white;
    margin-bottom: 2px;
}

.ControlData .ajax__calendar_footer
{
    margin-top: 1px;
    padding-bottom: 2px;
}

.ControlData .ajax__calendar_title,
.ControlData .ajax__calendar_next,
.ControlData .ajax__calendar_prev
{
    color: white;
    padding-top: 3px;
}

.ControlData .ajax__calendar_next
{
    background-image: url("../Imagenes/CalendarioACTDerecha.gif");
}
.ControlData .ajax__calendar_prev
{
    background-image: url("../Imagenes/CalendarioACTIzquierda.gif");
}

.ControlData .ajax__calendar_body
{
    background-color: #FAFAFA;
    border-bottom: solid 1px #006CB5;
}

.ControlData .ajax__calendar_dayname
{
    text-align: center;
    font-weight: bold;
    padding-top: 2px;
    margin-bottom: 0px;
    margin-top: 2px;
    border-bottom: none;
}

.ControlData .ajax__calendar_day
{
    text-align: center;
    padding-top: 3px;
    border: none !important;
    background-color: #FAFAFA !important;
    height: 16px;
    color: #006CB5;
}

.ControlData .ajax__calendar_days tbody
{
    border-top: 1px solid #006CB5;
}

.ControlData .ajax__calendar_active .ajax__calendar_day
{
    background-color: #ADDFF7 !important;
}

.ControlData .ajax__calendar_hover .ajax__calendar_day,
.ControlData .ajax__calendar_hover .ajax__calendar_month,
.ControlData .ajax__calendar_hover .ajax__calendar_year,
.ControlData .ajax__calendar_active
{
    color: #004080;
    font-weight: bold;
    background-color: #ffffff;
}

.ControlData .ajax__calendar_today
{
    font-weight: bold;
    color: #006CB5;
}

.ControlData .ajax__calendar_other,
.ControlData .ajax__calendar_hover .ajax__calendar_today
{
    color: #bbbbbb;
}

.ControlData .ajax__calendar_hover .ajax__calendar_title
{
    text-decoration: underline;
    color: white !important;
}

div.ControlData
{
    display: inline-block;
    width: 125px;
}

div.ControlData input[type="text"]
{
    margin-right: 0px;
    text-align: center;
    width: 86px;
}

div.ControlData img
{
    margin: 0px 0px 0px 2px;
    cursor: pointer;
    display: inline-block;
    vertical-align: top;
}
input.ControlHora
{
    margin-left: -11px;
    width: 32px;
}

/***********************************************************************************************************/
/*#endregion*/

/* #region ***** SELECTORES *****/
/***********************************************************************************************************/

table.Selector
{
    border: 0;
    display: inline-block;
    margin: 0;
    padding: 0;
    table-layout: inherit;
    line-height: 0px;
}

table.Selector td
{
    border: 0;
    margin: 0;
    padding: 0;
    vertical-align: top;
}

table.Selector td input[type=text]
{
    border-width: 1px;
    padding-bottom: 2px;
    padding-top: 2px;
    margin: 0px;
}

table.Selector td.CeldaCodigo
{
    display: table-cell;
    width: 119px;
}

table.Selector td.CeldaCodigo input
{
    width: 112px;
    padding-left: 3px;
}

table.Selector td.CeldaDescricion
{
    display: table-cell;
    width: 686px;
}

table.SelectorSinCodigo td.CeldaDescricion
{
    width: 808px;
}

.campoLargo table.Selector td.CeldaDescricion
{
    width: 343px;
}

.campoLargo table.SelectorSinCodigo td.CeldaDescricion
{
    width: 462px;
}

table.Selector td.CeldaDescricion input
{
    width: 678px;
}

.campoLargo table.Selector td.CeldaDescricion input
{
    width: 334px;
}

.campoLargo table.SelectorSinCodigo td.CeldaDescricion input
{
    width: 453px;
}

.campoExtraLargo table.SelectorSinCodigo td.CeldaDescricion input
{
    width: 798px;
}

table.Selector td.CeldaBotones
{
    display: table-cell;
    /*width: 40px;*/
}

table.Selector .IrA
{
    position: relative;
    z-index: 12;
}

table.Selector td.CeldaBotones input
{
    width: 20px;
    padding-bottom: 0px;
    margin: 0px;
    margin-left: 2px;
}

/***********************************************************************************************************/
/*#endregion*/

.campo .Sugerencia,
.campoLargo .Sugerencia,
.campoExtraLargo .Sugerencia
{
    /*height: 22px;
    width: 22px;
    display: inline-block;*/
    margin-top: -1px;
    cursor: pointer;
}

/* #region ***** BOTONES DE ACCION ***** */
/***********************************************************************************************************/

div.BotonesAccion
{
    text-align: center;
    clear: both;
    word-spacing: 20px;
}

.BotonAccion,
.BotonAccion:focus,
.BotonAccionPequeño,
.BotonAccionPequeño:focus,
.BotonAccionMediano,
.BotonAccionMediano:focus
{
    width: 100px;
    text-align: center;
    text-decoration: none;
    font-family: "Roboto";
    font-weight: 500;
    font-size: 14px;
    color: #006CB5;
    border: 2px solid #006CB5;
    padding: 0px 6px 0px 6px;
    border-radius: 6px;
    cursor: pointer;
    background-color: #FAFAFA;
    height: 35px;
    vertical-align: top;
    box-shadow: 1px 1px 1px gray;
    background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0, #FAFAFA), color-stop(0.43, #F2F2F2), color-stop(0.75, #E0E0E0) );
    background-image: -o-linear-gradient(bottom, #FAFAFA 0%, #F2F2F2 43%, #E0E0E0 75%);
    background-image: -moz-linear-gradient(bottom, #FAFAFA 0%, #F2F2F2 43%, #E0E0E0 75%);
    background-image: -webkit-linear-gradient(bottom, #FAFAFA 0%, #F2F2F2 43%, #E0E0E0 75%);
    background-image: -ms-linear-gradient(bottom, #FAFAFA 0%, #F2F2F2 43%, #E0E0E0 75%);
    background-image: linear-gradient(to bottom, #FAFAFA 0%, #F2F2F2 43%, #E0E0E0 75%);
}

.BotonAccion:disabled,
.BotonAccionPequeño:disabled,
.BotonAccionMediano:disabled
{
    color: #848484;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    /* filter: url(grayscale.svg); Firefox 4+ */
    filter: grayscale(100%); 
    filter: gray; /* IE 6-9 */
    opacity: 0.5;
}

.BotonAccion:focus:not(:disabled),
.BotonAccion:hover:not(:disabled),
.BotonAccionPequeño:focus:not(:disabled),
.BotonAccionPequeño:hover:not(:disabled),
.BotonAccionMediano:focus:not(:disabled),
.BotonAccionMediano:hover:not(:disabled)
{
    background-color: #FFFFFF;
    background-image: none;
}

.BotonAccion:active:not(:disabled),
.BotonAccionPequeño:active:not(:disabled),
.BotonAccionMediano:active:not(:disabled)
{
    background-color: #C8C8C8;
    background-image: none;
    padding: 1px 5px 0px 7px;
    border-top-width: 2px;
    border-right-width: 2px;
    border-left-width: 2px;
    box-shadow: 1px 1px 1px gray;
}

.BotonAccionPequeño,
.BotonAccionPequeño:focus
{
    height: 20px;
    width: 65px;
    border: 1px solid #006CB5;
    font-size: 12px;
}

.BotonAccionMediano,
.BotonAccionMediano:focus
{
    height: 26px;
    width: 80px;
}

div.ContenidoModal .BotonesAccion
{
    margin-top: 15px;
}

.BotonAccionConImagen,
.BotonAccionConImagen:focus
{
    width: 107px;
    text-align: left;
    text-decoration: none;
    font-family: "Roboto";
    font-weight: 400;
    font-size: 14px;
    color: #006CB5;
    border: 2px solid #006CB5;
    padding: 0px 6px 0px 6px;
    border-radius: 6px;
    cursor: pointer;
    background-color: #FAFAFA;
    height: 35px;
    background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0, #FAFAFA), color-stop(0.43, #F2F2F2), color-stop(0.75, #E0E0E0) );
    background-image: -o-linear-gradient(bottom, #FAFAFA 0%, #F2F2F2 43%, #E0E0E0 75%);
    background-image: -moz-linear-gradient(bottom, #FAFAFA 0%, #F2F2F2 43%, #E0E0E0 75%);
    background-image: -webkit-linear-gradient(bottom, #FAFAFA 0%, #F2F2F2 43%, #E0E0E0 75%);
    background-image: -ms-linear-gradient(bottom, #FAFAFA 0%, #F2F2F2 43%, #E0E0E0 75%);
    background-image: linear-gradient(to bottom, #FAFAFA 0%, #F2F2F2 43%, #E0E0E0 75%);
}
.BotonAccionConImagen:disabled
{
    color: #848484;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    /* filter: url(grayscale.svg); Firefox 4+ */
    filter: gray; /* IE 6-9 */
    opacity: 0.5;
}
.BotonAccionConImagen:focus:not(:disabled),
.BotonAccionConImagen:hover:not(:disabled)
{
    background-color: #FFFFFF;
    background-image: none;
}

.BotonAccionConImagen:active:not(:disabled)
{
    background-color: #C8C8C8;
    background-image: none;
    padding: 1px 5px 0px 7px;
    border-top-width: 2px;
    border-right-width: 2px;
    border-left-width: 2px;
}
.BotonAccionConImagen img
{
    margin-right: 2px;
    vertical-align: middle;
}

.BotonAccionConImagen span
{
    position: relative;
    top: 1px;
}

/***********************************************************************************************************/
/*#endregion*/

/* #region ***** TABLAS PAGINADAS *****/
/*********************************************************************************************/

.ListaAccionesTablaPaginada
{
    width: 100%;
    padding-left: 10px;
    box-sizing: border-box;
}

.ListaAccionesTablaPaginada li
{
    display: inline-block;
}

.ListaAccionesTablaPaginada .BotonAccionPequeño
{
    margin-right: 5px;
}

.TablaPaginada_Default
{
    height: 296px;
    width: 100%;
}
div.DesplegadoEnModal
{
    padding-top: 10px;
}
div.DesplegadoEnModal .TablaPaginada_Default
{
    height: 546px;
}
/*********************************************************************************************/
/*#endregion*/
