﻿/**{padding:0px;margin: 0px;outline: 0;}
body{font-family:Arial;font-size:12px;overflow:hidden;color:#777777;}
img{border:none;}
p{font-size:1em;margin: 0 0 1em 0;}
a{text-decoration:none;}*/

.ellipse{white-space:nowrap;width:100%;overflow:hidden;text-overflow:ellipsis;}
/*------- Maquetacion Pagina Maestra --------- */
header{position: absolute;height: 70px;top:0px;left:0px;right:0px;background: #EEEEEE;}
#ImgEmpresa{position:absolute;top:0px;left:0px;width:200px;height:70px;z-index:10;}
#NavMenuPrincipal{position:absolute;top:70px;left:0px;bottom:0px;width:240px;}
.Split{position:absolute;left:240px;top:70px;bottom:0px;width:10px;cursor:pointer;border-left:2px solid #E7E7E7}
#SecContenedorPlantilla{position:absolute;top:70px;left:250px;right:0px;bottom:0px;overflow:auto;}
#FooPagina{position:absolute;left:0px;right:0px;bottom:-12px;cursor:pointer;}
#DivInicioSesion{position:absolute;right:0px;bottom:5px;}

#imgBarraPlantilla{position:absolute;width:15px;height:100%;background: #EBEFF9 url(images/toggler_bg.gif) no-repeat left center;}  
#imgBarraPlantilla:hover{background: #c2cff1 url(images/toggler_bg.gif) no-repeat -25px center;cursor: pointer;}  
#imgBarraPlantilla.off{background: #EBEFF9 url(images/toggler_off_bg.gif) no-repeat left center;margin-left: 0;}  
#imgBarraPlantilla.off:hover{background: #c2cff1 url(images/toggler_off_bg.gif) no-repeat -25px center;margin-left: 0;}
#DivEstadoAutenticacion{position:absolute;right:15px;top:50px;color:White;}
#Cargando{display:none;color: Blue;position:absolute;top:5px;left:400px;}
#Cargando p{position:absolute;left:-20px;width:20px;height:20px;background-image:url(images/Cargando.gif);}
/*#SpanHora{position:absolute;right:10px;top:5px;font-size:2.7em;color:#FFFFFF;text-shadow: 0 0 0.4em #10183F, 0 0 0.4em #10183F,0 0 0.4em #10183F,0 0 0.4em #10183F;filter: progid:DXImageTransform.Microsoft.Shadow(color=#10183F,direction=0, Strength=4)progid:DXImageTransform.Microsoft.Shadow(color=#10183F,direction=90, Strength=4)progid:DXImageTransform.Microsoft.Shadow(color=#10183F,direction=180, Strength=4)progid:DXImageTransform.Microsoft.Shadow(color=#10183F,direction=270, Strength=4);font-family:Arial, Helvetica, sans-serif;font-weight: bolder;}*/
    
/* Estilo para registros
**********************************************************************************************************/
.Inactivo{color:White;background-color:Red;}
.N{text-align:center !important;width:30px;}
.Nombre{text-align:left;}
.Fecha{width:80px;text-align:center;}
    
/* Estilo para Tablas
**********************************************************************************************************/
.Tabla{border-collapse:collapse;width:100%;white-space: nowrap; table-layout: fixed;}
.Tabla tbody td{height:24px;overflow:hidden;text-overflow: ellipsis;}
/*.Tabla th{height:30px;font-weight:normal;}*/
.Tabla thead th{height:30px;border-bottom:1px solid #7A7A7A;cursor:pointer;overflow:hidden;text-align:left;text-overflow: ellipsis;}
.Tabla tbody tr:hover{background: none repeat scroll 0 0 #b2deff;color:#423d3d;cursor:pointer !important;}
/*table tbody tr:nth-child(5n+3) td
{
    background: none repeat scroll 0 0 #E6E6E6;
    }
table tbody tr:nth-child(5n+4) td
{
    background: none repeat scroll 0 0 #D8D8D8;
    }
table tbody tr:nth-child(5n) td
{
    background: none repeat scroll 0 0 #BDBDBD;
    }*/
/*table tbody tr:hover td 
{
    background: none repeat scroll 0 0 #D1E5EF;
    }

table tbody tr
{
    cursor:pointer;
    }*/


/**Estilo para que la tabla no cambie de color el focus********************************************************************************************************/



/**********************************************************************************************************/
.DivTabla{position:absolute;left:0px;top:55px;right:0px;bottom:25px;overflow:auto;}
/* Estilo para titulos de Formularios
**********************************************************************************************************/
.DivFondoTitulo{background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#ffffff), color-stop(100%,#eaeaea));background: -webkit-linear-gradient(top, #ffffff 1%,#eaeaea 100%);background: -o-linear-gradient(top, #ffffff 1%,#eaeaea 100%);background: -ms-linear-gradient(top, #ffffff 1%,#eaeaea 100%);background: linear-gradient(top, #ffffff 1%,#eaeaea 100%);filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffff, endColorstr=#eaeaea);border:0.01em solid Gray;height:25px;}
.DivTextoTitulo{font-family: 'Fjalla One', sans-serif;font-size:14px;color:#777777;text-indent: 4px;vertical-align:middle;margin-top:5px;}

/* Util
**********************************************************************************************************/
.Eliminar{background:url(images/IconoEliminar.png);width:18px;height:18px;}
.Mano{cursor:pointer;}
/*.Buscar{background:#FFFFFF url(images/Buscar.png) no-repeat 90px 4px;padding: 4px 30px 4px 4px;width: 80px;border: 1px solid #CCCCCC;border-radius: 4px 4px 4px 4px;}
  */  
/* Util para todos los Formularios
**********************************************************************************************************/
.Fila{clear: both;height:30px;}

.Col_titulo{float: left;padding: 5px;background: #F0E0A0;border-color: #F0E0A0;border-style: solid;border-right-width: 0px;border-left-width: 0px;border-top-width: 0px;border-bottom-width: 1px;}
.Columna{float: left;padding: 4px;border-color: #F0E0A0;border-style: solid;border-right-width: 0px;border-left-width: 0px;border-top-width: 0px;border-bottom-width: 1px;height:24px;}
.TextoDerecha{text-align:right;}
.Top{vertical-align:bottom;}
.Ancho100{width:100px;}
.Ancho150{width:120px;}
.Ancho250{width:250px;}
.Ancho400{width:400px;}
.error{background-color: #ffc;}
.BuscarPersonal{position:absolute;top:15px;right:20px;width:16px;height:16px;background-image:url(images/Buscar.png);}
/* Paso de Imagenes
**********************************************************************************************************/
.slideshow img { margin-left:0px;margin-top:0px;}

/* Para Formulario
**********************************************************************************************************/
fieldset{border: 1px solid #CCC;}
fieldset p{margin: 2px 12px 10px 10px;}
fieldset label{display: block;}
fieldset label.inline{display: inline;}
legend{font-size: 1.1em;font-weight: 600;padding: 2px 4px 8px 4px;}
.ImgCargando{width:200px;height:70px;display:none;}
.ImgCargando:hover{border:2px solid #E7E7E7;}
input[type='file']{display:none;}


/* Estructura   
**********************************************************************************************************/
#DivParametros{padding:5px;}
#DivTabla{position:absolute;top:40px;left:0px;right:0px;bottom:0px;overflow:auto;margin:5px 5px 0px 5px;}

/* Alertas
**********************************************************************************************************/
.Info,
.Exito,
.Alerta,
.Error{position:absolute;border:1px solid Red;top:5px;right:5px;border:1px solid;z-index:9;padding:15px 10px 15px 50px;background-repeat:no-repeat;background-position:10px center;}
.Info{color:#00529B;background-color:#BDE5F8;background-image:url(images/Mensajes/Info.png);}
.Exito{color:#4F8A10;background-color:#DFF2BF;background-image:url(images/Mensajes/Exito.png);}
.Alerta{color:#9F6000;background-color:#FEEFB3;background-image:url(images/Mensajes/Alerta.png);}
.Error{color:#D8000C;background-color:#FFBABA;background-image:url(images/Mensajes/Error.png);max-width:90%;}

/* Control html   
**********************************************************************************************************/
input[type='text'],
input[type='time'],
input[type='date'],
input[type='datetime-local'],
input[type='password'],
select{font-size:14px;padding:5px;color:#555555;color:#000000;vertical-align:middle;border:1px solid #CCCCCC;color:#777777;}
input[type='text']:focus,
input[type='password']:focus,
select:focus{border-color:#777777;outline:0;} 
button,
input[type='button']{font-size:14px;padding:5px 10px;vertical-align:middle;cursor:pointer;color:#777777;text-align:center;background-color:#F5F5F5;border:1px solid #CCCCCC;}
button:hover,
input[type='button']:hover{border-color: #777777;outline: 0;background-color:rgba(80, 124, 209, 0.6) !important;}

    
/* Arbol
**********************************************************************************************************/
/*ol.tree{padding: 0 0 0 0px;width:100%;}
li{position: relative; margin-left: 0px;list-style: none;}
li.file{margin-left: -1px !important;}
li.file a{background: url(images/Arbol/Documento.png) 0 0 no-repeat;color:#000;padding-left:20px;display:block;}
li.file a[href *= '.pdf']{background: url(images/Arbol/Documento.png) 0 0 no-repeat;}
li.file a[href *= '.html']{background: url(images/Arbol/Documento.png) 0 0 no-repeat;}
li.file a[href $= '.css']{background: url(images/Arbol/Documento.png) 0 0 no-repeat;}
li.file a[href $= '.js']{background: url(images/Arbol/Documento.png) 0 0 no-repeat;}
li input{position:absolute;margin-left:0;opacity:0;z-index:2;cursor:pointer;height:1em;width:1em;top:0;}
li input + ol{background: url(images/Arbol/Mas.png) 40px 0 no-repeat;margin: -0.938em 0 0 -44px;height: 1em;}
li input + ol > li{display:none;margin-left:-14px !important;padding-left:1px; }
li label{background: url(images/Arbol/Folder.png) 5px 0px no-repeat;cursor:pointer;display:block;padding-left:25px;}
li input:checked + ol{background: url(images/Arbol/Menos.png) 40px 5px no-repeat;margin: -1.25em 0 0 -44px;padding: 1.563em 0 0 80px;height: auto;}
li input:checked + ol > li { display: block; margin: 0 0 0.125em;}
li input:checked + ol > li:last-child { margin: 0 0 0.063em;}

*/
/* Subir Archivo
**********************************************************************************************************/
#filedrag{width:200px;height:70px;text-align:center;border:2px dashed #555;cursor:pointer;}
#filedrag.hover{color:#f00;border-color:#f00;border-style:solid;}
#messages{padding:0 10px;margin:1em 0;border:1px solid #999;}
#progress p{width:200px;height:4px;padding:0;margin:0;background: #eee url(images/Progreso.png) 100% 0 repeat-y;z-index:10;}
#progress p.success{background: #0c0 none 0 0 no-repeat;}
#progress p.failed{background: #c00 none 0 0 no-repeat;}

#DivCargando{display:none;color:Blue;position:absolute;top:5px;left:400px;}
#DivCargando p{position:absolute;width:32px;height:32px;background-image:url(images/Cargando.gif);}
#DivCargando span{position:absolute;left:34px;top:9px;}

/* ToolTip
**********************************************************************************************************/
[data-tip] {
	position:relative;

}
[data-tip]:before {
	content:'';
	/* hides the tooltip when not hovered */
	display:none;
	content:'';
    border-top: 5px solid #00C0FF;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
	position:absolute;
	top:-5px;
	left:50%;
	z-index:8;
	font-size:0;
	line-height:0;
	width:0;
	height:0;
}
[data-tip]:after {
	display:none;
	content:attr(data-tip);
	position:absolute;
	top:-33px;
	left:50%;
	padding:5px 10px;
	background:#00C0FF;
	color:White;
	z-index:9;
	font-size: 14px;
	height:18px;
	line-height:18px;
    box-shadow: 0px 0px 10px #00C0FF;
	white-space:nowrap;
	word-wrap:normal;
}
[data-tip]:hover:before,
[data-tip]:hover:after {
	display:block;
}

.Tabla tbody tr:nth-child(odd) {
    background-color: #eeeeee;
}

.contenedorFechaParaUtil{
	min-width: 190px;
	max-width: 200px;
	cursor: pointer;
	border-radius: .25rem;
	width: max-content;
	border: 1px solid #ccc !important;
	padding: .25rem 5px;
	display: grid !important;
	grid-template-columns: minmax(0,1fr) minmax(0, 8fr) minmax(0, 1fr);
	align-items: center;
	height: 34px;
	column-gap: 0.25rem;
}

.opcionesFecha{
	min-width: 300px;
	max-width: 400px;
	width: max-content;
	min-height: 120px;
	transition: all;
	transition-duration: 500ms;
	transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
	border:1px solid #ccc !important;
	border-radius: 0.25rem;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	z-index: 100000;position: absolute;
	padding: 0.5rem;
	background: #fff;
}

.contenedorOpciones{
	display: grid;
	grid-template-columns: minmax(0,30fr) minmax(0,70fr);
	flex-grow: 1;
	align-items: center;
	color: #000;
	column-gap: 0.25rem;
}

/*  RADIO BUTTON PARA MULTI SELECTOR DE FECHAS  */

.content-radio input[type="radio"] {
	display: none;
}

.content-radio label {
	position: relative;
	padding-left: 30px;
	color: #000000;
	cursor: pointer;
	transition: color 0.3s;
}

.content-radio label:before {
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-color: transparent;
	border: 2px solid #111111;
	transition: background-color 0.3s;
}

.content-radio input[type="radio"]:checked + label:before {
	background-color: #4778fd;
}

.content-radio input[type="radio"]:focus + label {
	color: #4778fd;
}

.content-radio input[type="radio"]:checked + label {
	color: #048cc6; /*#ff6f00*/
}
.content-radio input[type="radio"]:not(:disabled):hover + label {
	color: #048cc6; /*#ff6f00*/
}
.content-radio input[type="radio"]:disabled + label {
	cursor: not-allowed;
	opacity: 0.3;
}


.content-radio input[type="radio"]:not(:disabled):hover + label:before {
	background-color: #4778fd;
}

.content-radio input[type="radio"]:focus + label:before {
	background-color: #4778fd;
}

/*  FILTROS FLOTANTE */
.cs-message-receptor {
	color: #000;
	max-width: 700px;
	min-width: 350px;
	width: max-content;  
	transition: all;
	transition-duration: 500ms;
	transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
	z-index: 10000;
	position: absolute;
	padding: 20px 10px;
	background: #dfdbdb;
	border-radius: 10px;
	margin: 15px 10px;
}

.cs-message-receptor::before {
	content: "";
	position: absolute;
	top: 0px;
	left: 0px;
	bottom: -1px;
	width: 35px;
	height: 30px;
	border-radius: 5px;
	background-color: #dfdbdb;
	transform: skew(0deg, 45deg);
}