/* Conjunto de estilos que permiten darle formato a los objetos mostrados en toda las página web */

	/* Ejemplo de estilos FLAT CSS https://colorlib.com/wp/html5-and-css3-login-forms/ */
	@font-face {
		font-family: 'Roboto';
		font-style: normal;
		font-weight: 400;
		src: local('Roboto Light'), local('Roboto-Light'), url("../librerias/fonts/Roboto/Roboto-Regular.ttf");
	}

	@font-face {
		font-family: 'Roboto';
		font-style: Bold;
		font-weight: bold;
		src: local('Roboto Bold'), local('Roboto-Bold'), url("../librerias/fonts/Roboto/Roboto-Bold.ttf");
	}

	/*@font-face {
		font-family: 'Roboto';
		src: local('Roboto Bold'), local('Roboto-Bold'), url("../librerias/fonts/Roboto/Roboto-Bold.ttf") format('woff2');
	}*/

	/* Para chrome, firefox y otros */
	@font-face {
		font-family:"lato";
		src: local("Roboto Regular"), local("Roboto-Regular"), url("../librerias/fonts/Roboto/Roboto-Regular.ttf");
	}

	@font-face{
	  font-family: "lato";
	  font-style: normal;
	  font-weight: 700;
	  src: local("Roboto Bold"), local("Roboto-Bold"), url("../librerias/fonts/Roboto/Roboto-Bold.ttf");
	}

	.btn-label {
		position: relative;
		left: -9px;
		display: inline-block;
		padding: 6px 12px;
		background: rgba(0, 0, 0, 0.15);
		border-radius: 3px 0 0 3px;
	}

	.row{
		font-family: "lato";
		font-size: 14px;
	}
	
	/*Corrección para los botones bootstrap */
	.btn-labeled {
		padding-top: 0;
		padding-bottom: 0;
	}
	
	.btn {
		margin-bottom: 10px;
	}

	/* Para uso de iconos material design de google https://github.com/google/material-design-icons */
	/*@font-face {
		font-family: 'Material Icons';
		font-style: normal;
		font-weight: 400;
		src: url(../librerias/fonts/Materialize/Material-Icons.eot); 
		src: local('Material Icons'),
		  local('MaterialIcons-Regular'),
		  url(../librerias/fonts/Materialize/material-icons.woff2) format('woff2'),
		  url(../librerias/fonts/Materialize/material-icons.woff) format('woff'),
		  url(../librerias/fonts/Materialize/material-icons.ttf) format('truetype');
	}

	.material-icons {
		font-family: 'Material Icons';
		font-weight: normal;
		font-style: normal;
		font-size: 24px;  
		display: inline-block;
		line-height: 1;
		text-transform: none;
		letter-spacing: normal;
		word-wrap: normal;
		white-space: nowrap;
		direction: ltr;
	  
		/* Support for all WebKit browsers. */
		/*-webkit-font-smoothing: antialiased;*/
		/* Support for Safari and Chrome. */
		/*text-rendering: optimizeLegibility;*/
	  
		/* Support for Firefox. */
		/*-moz-osx-font-smoothing: grayscale;*/
	  
		/* Support for IE. */
		/*font-feature-settings: 'liga';*/
	/*}*/

	/*.material-icons.md-12 { font-size: 12px; }
	.material-icons.md-14 { font-size: 14px; }
	.material-icons.md-16 { font-size: 16px; }
	.material-icons.md-18 { font-size: 18px; }
	.material-icons.md-24 { font-size: 24px; }
	.material-icons.md-36 { font-size: 36px; }
	.material-icons.md-48 { font-size: 48px; }*/


	.flexbox {
		display: flex !important;
	}
	
	.hidden {
		display: hidden !important;
	}

	h4 {
		margin-bottom: 2px;
		margin-top: 2px;
		font: 22px 'Roboto';
	}
	
	body {
  	  margin: 0;
	  padding:0;
	}

	/* Aplica el tamaño y tipo de texto a las etiquetas encerradas en <p> */
	p{
		/* Atributos aplicado a todos los <p> (párrafo) */
		margin:0px 0px;
	}

	.claseValorCotizacion,.claseValorCotizacion[disabled]{
		color: darkred !important;
		font-weight: bold;
		font-size: 20px;
	}

	.claseValorCotizacion::before {
		content:'$ ';
	}

	.fuente{
		font:14px 'Lato';
	}

	/* Aplica el tamaño y tipo de texto a las etiquetas encerradas en <label> */
	label {
		font:14px 'Lato';
		vertical-align: middle;
		height: auto;
		padding-top: 5px;
		color:black; /*#fffdfd;*/	
	}

	fieldset {
		font:14px 'Lato';
	}
	
	table td{
		padding: 0px;
		text-align: none;
	}

	/* small text*/
	.tp * {
		font-size:12px;
	}

	.tm, .tm * {
		font-size:16px !important;
	}
	
	.tAzul,.tAzul *{
		color:#005F97;
	}

	.tBlanco,.tBlanco *{
		color:white  !important;
	}

	.tRojo,.tRojo *{
		color:#c93d1d !important;
	}

	.tNegro,.tNegro *{
		color:black;
	}

	.tVerde,.tVerde *{
		color:green;
	}

	.tNaranja,.tNaranja *{
		color:orange;
	}

	.tGris,.tGris *{
		color:#00000078;
	}

	.btn-primario {
		--bs-btn-color: #fff;
		--bs-btn-bg: #3498DB;
		--bs-btn-border-color: #3498DB;
		--bs-btn-hover-color: #fff;
		--bs-btn-hover-bg: #3cb0fd;
		--bs-btn-hover-border-color: #3cb0fd;
		--bs-btn-focus-shadow-rgb: 49, 132, 253;
		--bs-btn-active-color: #fff;
		--bs-btn-active-bg: #3cb0fd;
		--bs-btn-active-border-color: #0099ff;
		--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
		--bs-btn-disabled-color: #fff;
		--bs-btn-disabled-bg: #BABABA;
		--bs-btn-disabled-border-color: #BABABA;
	  }

	/* Se oculta spinner para incrementar/dec números en inputs type number */
	/* Chrome, Safari, Edge, Opera */
	.claseNoSpin::-webkit-outer-spin-button,
	.claseNoSpin::-webkit-inner-spin-button {
	  -webkit-appearance: none;
	  margin: 0;
	}
	
	/* Firefox */
	.claseNoSpin{
		-moz-appearance: textfield;
		appearance: textfield;
 	 }

    .claseInfo{ 
        font:Lato;
        font-size: inherit;
        font-weight: normal;
        display: inline;
        position: static;
        float:none;
        box-sizing: content-box;
    }

	/**
	 * Permite que la letras pasen a la siguiente línea y no se sobreponga a la columna siguiente del grid
	 */
	span,h2,h3{
		font-family: Lato;
		word-wrap: break-word;
	}

	h1, h2, h3, h4, h5, h6{
		margin-top: 0px;
		margin-bottom: 0px;
	}

	a{
		color: black;
	}

	/**
	 * Etiqueta con fondo para mostrar información de un campo dentro de un formulario
	 */
	.labelContenido{
		display: inline-block;
		/*float: left;*/
		width: auto;
		height: auto;
		word-wrap: break-word;
		font-size: 12px;
		/*letter-spacing:0.5px;*/
		/*box-sizing: border-box;*/
		/*padding: 6px;*/
	}

	.labelContenido span, .labelContenido a{
		color: black;/*#666;*/
		background: white;/*#647488*/
		font-family: lato;
		padding: 3px;
		font-size: 11px !important;
		width: auto;
		/*min-width: 50px;*/
		min-height:20px;
		height: auto;
		box-sizing: border-box;
		white-space: normal;
		/*display: inline-block;*/
		position: relative;
		float:left;
		margin-top: 0px !important;
	}

	.labelContenido span{
		border: 1px solid #8e8e8e;
	}

	a{
		font: 13px "lato";
		margin-right: 0px;
		padding: 0px;
		margin-top: 5px;
	}

	/* Formato de mensaje toast 				*/
	.toast-message{
		font: 13px "lato";
	}

	#toast-container>div{
		opacity: 1; /* 1= Se muestra sin opacidad*/
	}
	/**********************************************/

	.claseBorde{
		border-top:  2px;
		border-top-color: #666;
		border-top-style: dotted;
	}

	/**
	 *	Se aplica propiedades a todos los elementos a través del evento focus
	*/
	input:focus,button:focus,textarea:focus {
		border: 2px solid #70B6E5;
		outline: none;
	
	}

	/**
	 * Aplica estilo a la cabecera de la página web principal
	 */
	.claseCabecera{
		position: fixed;
		z-index: 100;
		margin: 0px;
		left: 0;
		top: 0;
		width: 100%;
		box-shadow: 0px 0px 10px;
	}

	/**
	 * Aplica estilo al contenido de la página web principal
	 */
	.claseContenido{
		padding: 0px;
		top:83px;
		width: 100%;
		display: block;
		
		/*position: relative;*/
		border-spacing: 0px;
		background: #FFFFFF;

		/* Permite separar la cabecera del contenido del página y que el scroll solo se aplique al contenido */
		overflow-y:auto !important;
		position: absolute !important;

		/* Se aplica efecto de transición en el div claseContenido cuando a este se le cambia el top o bottom */
		-webkit-transition:all 1s ease;
		-moz-transition:all 1s ease;
		-ms-transition:all 1s ease;
		-o-transition:all 1s ease;
		transition:all 1s ease;
	}

	/**
	 * Aplica al Titulo mostrado en la cabecera de la página principal
	 */
	.claseFondoTituloPrincipal{
		font: 24px lato;
		text-shadow: 1px 1px #000000;
		font-weight:bold;
		letter-spacing:5px;
		width:100%;
		height:auto;
		padding: 0px;
		margin: 0px;
		background: #11476b;
		border-spacing: 0px;
		border: 0px;
		display: block;
		float: left;
	}

	/**
	* Atributos aplicados al banner mostrado en la pantalla principal el TOP
	 */
	.claseTituloPrincipal {
		color:#FFBF00;
		cursor:default;
		font: 24px lato;
		text-shadow: 1px 1px #000000;
		font-weight:bold;
		letter-spacing: 1px;
		padding-left: 5px;
		padding-top: 5px;
		padding-bottom: 5px;
		padding-right: 0px;
		margin-right: 0px;
		display: inline-block;
		float: left;
		width: auto;
		height: auto;
		box-sizing: border-box;
		position: relative;
	}

    .claseDivSMProgFijo{
        display: inline-block;
    }

    .claseDivSMProgFijo:hover{
        cursor:pointer !important; /* Cursor mano */
    }

    .claseDivMenuResponsive{
        background: #11476b;
    }

	/**
	 * Agrega un guion antes del texto del estilo
	 */
	.lblTextoTituloPrincipal:before{
		content:" ";
	}

	/**
	 *  Agrega un guion antes del texto del estilo
	 */
	.lblTextoTituloPrincipal:before{
		content:" ";
	}

	/**
	 *  Atributos aplicados al banner mostrado en la pantalla principal el TOP
	 */
	.lblTextoTituloPrincipal {
		font: 12px lato;
		color:#FFBF00 !important;
		text-shadow: 1px 1px #000000;
		letter-spacing: 0px;
		font-weight:bold;
		height:auto;
		width:100%;
		float:left;
		text-transform: uppercase; /* Transforma el texto a mayusculas  */
		padding:0px;
		margin:0px;
		word-wrap: break-word;
	}

	/**
	 *  Le da formato a la línea NARANJA en la cabecera de la página principal
	 */
	.claseFiloTituloSecundario {
		padding: 2px;
		background: rgba(255,175,75,1);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc7812', endColorstr='#ffaf4b', GradientType=0 );
		border: 0px;
		border-spacing: 0px;
		display: block;
		float: left;
		width: 100%;
		box-sizing: border-box;
	}

	/**
	 * Aplica en la página de inicio de sesión
	 */
	.login-form {
		  background-color: #edeff1;
		  padding: 24px 23px 20px;
		  position: relative;
		  border-radius: 6px;
		  display: inline-block;
		  margin:auto;
		  position: relative;
	}


	/* Aplica a cada formulario(Página) */
	.claseFormulario{
		display:block; /*table*/
		border-collapse: separate;
		width:100%;
		background: inherit;
	}

	/**
	 *  Aplica al título de cada Formulario
	 */
	.claseFormularioTitulo{

		/* Color de fondo degradado  */
		/* Fuente */
		color: #5F686D;  /*white; */
		text-align:left;
		font-family:"lato";
		font-size: 1.5rem;
		font-weight: bold;
		/*letter-spacing: 7px;*/
		height: auto;
		padding-top: 10px;
		padding-left: 15px;
		padding-bottom: 5px;
		display: inline-block;
		box-sizing: border-box;
		background-color: inherit;/*#6c757d;*/ /**/;

	}

	/**
	 * Aplica fondo a cada formulario y se ubica por debajo de claseFormularioTitulo
	 */
	.claseFondoFormulario{
		border-spacing: 15px;
		padding-left: 10px;
		padding-top:  0px;
		padding-right: 10px;
		padding-bottom: 5px;
		/*float: left;*/
		position: relative;
		display: inline-block; /* inline-table*/
		box-sizing: border-box;
		width: 100%;
		background-color: white; /*#41464b;*/ /*inherit*/;
		color:black; /*white*/ ;
	}


	/* Aplica a un groupbox de cada formulario (Borde del Groupbox) */
	.clasePanel{
		/* Define el espacio entre celdas de la tabla */
		padding: 0px;
		border-spacing: 0px;
		margin-bottom: 6px;
		border-collapse:separate; /* Evita que el borde afecte el interior del contenedor */
		width: 100%;
		height: auto;
		display: inline-block;
		overflow: hidden;
		border: 0px solid #CCCCCC;  /* Color del borde */
		-webkit-box-shadow: 2px 4px 8px 0px rgba(50, 50, 50, 0.75);
		-moz-box-shadow:    2px 4px 8px 0px rgba(50, 50, 50, 0.75);
		box-shadow:         2px 4px 8px 0px rgba(50, 50, 50, 0.75);
	}

	.claseSinShadow{
		-webkit-box-shadow: none;
		-moz-box-shadow:    none;
		box-shadow:         none;
	}

	/* Aplica a un groupbox de cada formulario (Solo el detalle) */
	.claseFondoPanel{

		/*float:left;*/
		border-collapse: separate;
		padding: 2px;
		background: inherit;
		width: 100%;
		/*height: 100%;*/
		height: auto;
		display: inline-block; 
		box-sizing: border-box; /* Evita que al hacer padding se sobresalga del div contenedor clasePanel */
		color:inherit;

	

	}

	/* Aplica al título de cada Groupbox */
	.clasePanelTitulo{
		/* Usado para darle formato a los titulos de los groupbox */

		/* Fuente */
		color:#FFFFFF;
		font-size:0.9rem;
		font-weight: bold;
		font-family:"lato";

		/*Color de fondo */
		background: #005F97;
		width:auto;
		height: auto;

		display: flex;
		justify-content: space-between;
		align-items: center;
		overflow: visible;
		padding: 5px; 
	}

	/* Fijar el título en la ventana  cuando se hace scroll down*/
	.clasePanelTitulo{
		position: -webkit-sticky;
		position: sticky;
		top: 0;
		/*z-index: 1;*/
	}

	/* Se agregan dos veces dos puntos al texto mostrado en los títulos de las etiquetas de grupo  */
	/*.clasePanelTitulo:before {
		content: "::"; 
	}*/

	/**
	 * Aplica al texto mostrado al final de la página principal
	 */
	.claseTextoPiePrincipal,.claseTextoPiePrincipal label{
		text-shadow: none;
		text-decoration-color: #000000;
		letter-spacing: normal;
		height: auto;
		font-size:11px;
		padding: 5px;
		margin-right: 5px;
		box-sizing: border-box !important;
	}

	/**
	 * Aplica al contenedor primario de todos los grid
	 */
	.claseGridContent{
		table-layout: fixed;
	 	width: 100%;
		/*min-height: 300px;*/
		padding: 5px;
		border-spacing: 0px;
		border: 1px solid #CCCCCC;
		border-width:1px 0px 0px;  /* Se muestra un borde o separador en el margen superior unicamente  */
	}

	/**
	 * Aplica a contenedor secundarios de todos los grid
	 */
	.claseDivGrid{
		border-collapse: separate;
		width:100%;
		color:white;
		padding:0px;
		margin:0px;
		border-spacing: 0px;
		min-width:10%;
		float:left;
	    overflow-x:scroll;
	    overflow-y:scroll;
		background-color:#90A4AE;
		position:relative;
		display: inline-block;
		border: 1px solid #CCCCCC;


	}

	/**
	 * Aplica formato al grid de forma directa
	 */
	.claseGrid {
		/* Aplica formato al Grid  */
		table-layout: fixed; /* Permite aplicar ancho a las columnas,si se quita las columnas se autoajustan y no responden al ancho que se les indique  */
		margin:0px;
		padding:0px;
		border-spacing: 0px;
		width:100%;
		border:1px solid #C6D3D9;    /* Color del borde */
		border-width:0px 1px 1px 0px;
		overflow-x: auto; /* hidden para que no se muestre */
		overflow-y: auto;
		border-collapse: separate;
		transform: rotateX(0deg);
	}

	/**
	 * Las siguientes clases aplican formato a las filas del grid
	 * @type {[type]}
	 */
	.claseGrid tr:last-child td:last-child {
		-moz-border-radius-bottomright:0px;
		-webkit-border-bottom-right-radius:0px;
		border-bottom-right-radius:0px;
	}

	.claseGrid table tr:first-child td:first-child {
		-moz-border-radius-topleft:0px;
		-webkit-border-top-left-radius:0px;
		border-top-left-radius:0px;
	}
	.claseGrid table tr:first-child td:last-child {
		-moz-border-radius-topright:0px;
		-webkit-border-top-right-radius:0px;
		border-top-right-radius:0px;
	}
	.claseGrid tr:last-child td:first-child{
		-moz-border-radius-bottomleft:0px;
		-webkit-border-bottom-left-radius:0px;
		border-bottom-left-radius:0px;
	}

	.claseGrid tr:hover{
		/* Aplica color sombreado a la celda cuando el cursor se encuentre encima de la fila, en este caso de la cabecera */
		cursor:pointer;
		background: #f2f6f8;
		background: -moz-linear-gradient(top, #f2f6f8 0%, #d8e1e7 48%, #b5c6d0 51%, #e0eff9 100%);
		background: -webkit-gradient(left top, left bottom, color-stop(0%, #f2f6f8), color-stop(48%, #d8e1e7), color-stop(51%, #b5c6d0), color-stop(100%, #e0eff9));
		background: -webkit-linear-gradient(top, #f2f6f8 0%, #d8e1e7 48%, #b5c6d0 51%, #e0eff9 100%);
		background: -o-linear-gradient(top, #f2f6f8 0%, #d8e1e7 48%, #b5c6d0 51%, #e0eff9 100%);
		background: -ms-linear-gradient(top, #f2f6f8 0%, #d8e1e7 48%, #b5c6d0 51%, #e0eff9 100%);
		background: linear-gradient(to bottom, #f2f6f8 0%, #d8e1e7 48%, #b5c6d0 51%, #e0eff9 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f6f8', endColorstr='#e0eff9', GradientType=0 );
		font-size:10px;
		padding:4px;
	}

	.claseGrid tr:nth-child(odd){
		background-color:#ffffff; /*Color de fondo de PRIMERA fila alternada */
	}
	.claseGrid tr:nth-child(even){
		background-color:#EAEAEA; /*Color de fondo de SEGUNDA fila alternada */
	}

	.claseGrid tr{
		border:1px solid #ddd ;
	}

	.claseGrid tr:first-child th{
		/* La fila de cabecera de columnas del Grid */
		text-align: center;
		font-family: "Lato";
		font-weight: bold;
		padding:3px;
		height: 35px;
		overflow: visible;
		background: steelblue;
		font-weight: lighter;
		color: white;
		border: 1px solid #ffffff; /* Color del borde */
		border-width:0px 1px 0px 0px;
		box-shadow: inset 0px 1px 2px #568ebd;
    }

	.claseGrid tr:first-child th label{
		padding: 0px;
		margin: 0px;
		overflow: visible;
		display: inline-block;
	}


	.claseGrid thead tr:hover{
		cursor:default; /* Que no se muestre el cursor de la mano cuando se ponga encima de la cabecera del grid */
	}

    .claseGrid thead tr th{  /* sticky: Permite fijar la cabecera aún cuando se hace scroll a la tabla 05/05/2021 */
        position: sticky;
        top: 0;
        z-index: 1;
        /*width: 10vw;*/
    }


	.claseGrid td{
		/* Las filas de detalle  */
		vertical-align:middle;
		border: 1px solid #ffffff;    /*#C6D3D9;*/   /* Color del borde */
		border-width: 0px 1px 1px 0px;
		border-bottom: 1px solid #ddd;
		min-width: 100px;
		height: 25px;
		position: relative;
		
	}

	.claseGrid td span{
		text-align:left;
		font-size:12px;
		font-family:'Roboto';
		overflow-wrap: anywhere;
		/*color: #000000;*/
	}

	.cursorNormal{
		cursor:default;
	}
	

	/*.claseGrid tr:last-child td{*/
		/* Aplica formato a los td de la ultima fila del grid */
		/*border-width: 1px 1px 1px 1px !important;
	}*/

	/* Formato a los controles dentro del grid  */
	.claseGrid textarea {
		width:100%;
		border-radius: 0px;
		font-weight:normal;
		font-size: 10px;
		box-sizing: border-box;
		display: inline-block;
		float: left;
		position: relative;
	}

	.claseGrid input[type=text]{
		width:100%;
		height:25px;
		border-radius: 0px;
		/*font-weight:normal;*/
		font-size: 11px;
		margin-top: 0px;
		padding: 0 0px;
	}

	.claseGrid select{
		width:100%;
		height:25px;
		border-radius: 0px;
		font-weight:normal;
		font-size: 10px;
		margin-top: 0px;
		padding: 0 0px;
	}

	/* Cuando una fila es clickeada por el usuario */
	.claseFila-Highlight {
		background-color: #039be5 !important;
		color: white !important;
		border-left: 1px solid #039be5 !important;
		border-right: 1px solid #039be5 !important;
		border-top: 2px solid #000000  !important;
		border-bottom: 2px solid #000000 !important;
	}

	.claseFila-Highlight label{
		color: white !important;
	}

	/* Cuando una fila es clickeada por el usuario */
	.claseFila-Red {
		border-style: solid !important;
		border-color: red !important;
		border-collapse: collapse;
	}

	.claseFila-Orange{
		border-style: solid !important;
		border-color: orange !important;
		border-collapse: collapse;
	}

	th {
		/* Parámetros dentro de cada item o etiqueta de la cabecera  */
		text-align: left; /* IE */
		font-size:12px; /* Tamaño del texto */
		font-weight:bold;
		box-sizing: border-box;
		height: auto;
		overflow: visible;
	}

	/* Clase que define los parametros en cada celda de la cabecera  */
	.th-inner {
		
		position: absolute;
		top: 0;
		text-align: left;
		font-size:10px;
		min-width:20px;
		overflow: visible;
		padding-left:5px;
		padding-right:5px;
		height: 100px;
		box-sizing: border-box;
	}

	/**
	 * Aplica a contenedor del grid que permite mostrar un scroll a la derecha del mismo
	 */
	.claseDivScrollGrid{
		white-space:nowrap;
	    display:inline-block;
		position: relative;
  	}

	/**************************************************************************************************************************************************/
	/* Atributos aplicados a todos los input (textbox) */
	textarea,.claseTextBox,.claseIconoLogin,input[type=number] {
		/* Ancho del input por default si no se define en html */
		height: 25px; /* Alto del input por default si no se define en html */
		float:none;
		color:black;
		font-family:"Lato";
		font-size: 11px;
		border-style: solid;
		border-width: 1px;
		border-color: #bdc3c7;
        padding: 5px 0.6em 5px 0.6em;
		vertical-align: bottom;
		-o-box-sizing: border-box;
		box-sizing: border-box;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: normal;
		text-transform:uppercase;  /* Muestra el texto solo en mayuscula, solo es visual se debe transformar a mayuscul en lado servidor */
		display: inline-block;
	}

	.claseIconoLogin{
		border-width:  2px 0px 2px 2px !important;
		border-radius: 0px;
		padding: 1px 7px 1px;
		width: 50px !important;
		height: auto !important;
		-webkit-filter: opacity(50%);
		filter: opacity(50%);
	}

	#frmUsuario{
		/*width:350px;*/
		height:auto;
		padding-left:30px;
		padding-right:30px;
		padding-top:15px;
		box-sizing: content-box;
	}

	textarea::-webkit-input-placeholder ,.claseTextBox::-webkit-input-placeholder {
		color: #A4A4A4;
	}
	textarea:focus,.claseTextBox:focus {
		border: 1px solid #70B6E5;
	}

	/* Iconos de pulgar arriba/abajo aparecen cuando se escribe mal el email sobre un input */
	textarea:required:invalid, textarea:focus:invalid,.claseTextBox:required:invalid, .claseTextBox:focus:invalid {
	    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAeVJREFUeNqkU01oE1EQ/mazSTdRmqSxLVSJVKU9RYoHD8WfHr16kh5EFA8eSy6hXrwUPBSKZ6E9V1CU4tGf0DZWDEQrGkhprRDbCvlpavan3ezu+LLSUnADLZnHwHvzmJlvvpkhZkY7IqFNaTuAfPhhP/8Uo87SGSaDsP27hgYM/lUpy6lHdqsAtM+BPfvqKp3ufYKwcgmWCug6oKmrrG3PoaqngWjdd/922hOBs5C/jJA6x7AiUt8VYVUAVQXXShfIqCYRMZO8/N1N+B8H1sOUwivpSUSVCJ2MAjtVwBAIdv+AQkHQqbOgc+fBvorjyQENDcch16/BtkQdAlC4E6jrYHGgGU18Io3gmhzJuwub6/fQJYNi/YBpCifhbDaAPXFvCBVxXbvfbNGFeN8DkjogWAd8DljV3KRutcEAeHMN/HXZ4p9bhncJHCyhNx52R0Kv/XNuQvYBnM+CP7xddXL5KaJw0TMAF8qjnMvegeK/SLHubhpKDKIrJDlvXoMX3y9xcSMZyBQ+tpyk5hzsa2Ns7LGdfWdbL6fZvHn92d7dgROH/730YBLtiZmEdGPkFnhX4kxmjVe2xgPfCtrRd6GHRtEh9zsL8xVe+pwSzj+OtwvletZZ/wLeKD71L+ZeHHWZ/gowABkp7AwwnEjFAAAAAElFTkSuQmCC);
	    background-position: right top;
	    background-repeat: no-repeat;
	    -moz-box-shadow: none;
	}
	textarea:required:valid,.claseTextBox:required:valid {
		background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAepJREFUeNrEk79PFEEUx9/uDDd7v/AAQQnEQokmJCRGwc7/QeM/YGVxsZJQYI/EhCChICYmUJigNBSGzobQaI5SaYRw6imne0d2D/bYmZ3dGd+YQKEHYiyc5GUyb3Y+77vfeWNpreFfhvXfAWAAJtbKi7dff1rWK9vPHx3mThP2Iaipk5EzTg8Qmru38H7izmkFHAF4WH1R52654PR0Oamzj2dKxYt/Bbg1OPZuY3d9aU82VGem/5LtnJscLxWzfzRxaWNqWJP0XUadIbSzu5DuvUJpzq7sfYBKsP1GJeLB+PWpt8cCXm4+2+zLXx4guKiLXWA2Nc5ChOuacMEPv20FkT+dIawyenVi5VcAbcigWzXLeNiDRCdwId0LFm5IUMBIBgrp8wOEsFlfeCGm23/zoBZWn9a4C314A1nCoM1OAVccuGyCkPs/P+pIdVIOkG9pIh6YlyqCrwhRKD3GygK9PUBImIQQxRi4b2O+JcCLg8+e8NZiLVEygwCrWpYF0jQJziYU/ho2TUuCPTn8hHcQNuZy1/94sAMOzQHDeqaij7Cd8Dt8CatGhX3iWxgtFW/m29pnUjR7TSQcRCIAVW1FSr6KAVYdi+5Pj8yunviYHq7f72po3Y9dbi7CxzDO1+duzCXH9cEPAQYAhJELY/AqBtwAAAAASUVORK5CYII=);
		background-position: right top;
		background-repeat: no-repeat;
	}

	/* Clase aplicado a los textbox cuando se encuentra en un estado solo lectura */
	textarea[readonly],textarea[disabled],.claseTextBox[readonly],.claseTextBox[disabled],.claseDateTime[disabled],.claseComboBox[disabled] {
		
		background: -moz-linear-gradient(-45deg,  #f6f8f9 0%, #e5ebee 50%, #d7dee3 51%, #f5f7f9 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#f6f8f9), color-stop(50%,#e5ebee), color-stop(51%,#d7dee3), color-stop(100%,#f5f7f9)); 
		/* Chrome,Safari4+ */
		background: -webkit-linear-gradient(-45deg,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* Chrome10+,Safari5.1+ */
		background: -	o-linear-gradient(-45deg,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(-45deg,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* IE10+ */
		background: linear-gradient(135deg,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#f5f7f9',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
		background-size: 0px !important;
		color: #666666;
		/*background: #f6f8f9;*/ /* Old browsers */
		background: #EBEBE4;
	}

	.divCheckBoxPadre{
		cursor:pointer;
		height: 100%;
		display: table;
		vertical-align: middle;
	}

	.divCheckBoxHijo1{
		position:relative;
		display: table-cell;
	    vertical-align:middle;
	}

	.divCheckBoxHijo2{
		position:relative;
		height:100% !important;
		min-height:100% !important;
		vertical-align: middle;
	    display: table;
	}

	.divCheckBoxHijo2 div{
		font-family:lato;
		font-size: 12px;
		display: table-cell;
		vertical-align:middle;
	}

	.claseCheckBox{
		width:15;
		height:17;
		margin:0;
		margin-left:0;
		/*margin-top: 2px;*/
		margin-right: 2px;
		display: inline-block;
		vertical-align: middle;
		padding: 3px;
		float: left;
		cursor: pointer;
	}

	.claseDateTime{
		width:auto; /* Ancho del input por default si no se define en html */
		height: 25px;
		/*height: 20px !important;*/ /* Alto del input por default si no se define en html */
		margin-top: 0px !important;
		/*padding: 0 12px;*/
		font-size: 11px;
		font-family:"Lato";
		border-style: solid;
		border-width: 1px;
		border-color: #bdc3c7 ;
		padding: 5px 0.6em 5px 0.6em;
		outline:none;
		vertical-align: bottom;
		-o-box-sizing: border-box;
		box-sizing: border-box;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: normal;
		float:none;
		display: block;
		position: relative;
		direction: ltr;
	}

	.claseComboBox {
		text-indent: 1px;
		width: 245px;
		height: 100%;
		font-family: "lato", sans-serif;
		font-size: 11px ; 
		color: #000000;
		background-color: white;
		border-style: solid;
		border-width: 1px;
		border-color: #bdc3c7 ;
		-webkit-transition: border-color 0.5s ease-in-out;
		transition: border-color 0.5s ease-in-out;
		border-radius:3px;
		padding: 4px 20px 4px 0.5em;
		outline:none;
		-webkit-appearance: none;
		-moz-appearance: none;
		-ms-appearance: none;
		appearance:none;
		 /* Some browsers will not display the caret when using calc, so we put the fallback first */
		background: url("../librerias/imagenes/br_down.png") white no-repeat 95% ;  /* !important used for overriding all other customisations */
		background: url("../librerias/imagenes/br_down.png") white no-repeat calc(100% - 10px) ; /* Better placement regardless of input width */
		background-size: 10px 10px !important;
		/*padding:0px;*/
	}

	.claseComboBox::-ms-expand{
    	display: none !important; /*Oculta el icono de desplazamiento hacia abajo ubicado a la derecha del control */
	}

	
	.claseComboBox:-moz-placeholder { color: #fff; }
	.claseComboBox:-ms-input-placeholder { color: #fff; }
	.claseComboBox::-webkit-input-placeholder { color: white; }
	.claseComboBox:focus {
			border-color: #70B6E5;
	}


	/* Estilos aplicados a todos los button  */
	.claseBoton, .claseBotonEliminar,.claseBotonAgregar, .claseBotonImprimir, .claseBotonPaginado {
		/* Pagina para editar estilos  de botones: http://cssdeck.com/labs/beautiful-flat-buttons */
		cursor: pointer; /* Tipo de cursor aplicado cuando se pasa el cursor */
		width: auto;
		height: 25px;
		padding: 0;
		margin: 0;
		color: white !important;
		text-align: center;
		text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
		background: #3498DB;
		border: 0;
		cursor: pointer;
		-webkit-box-shadow: inset 0 -2px #2a8bcc;
		box-shadow: 2px 2px 2px #666;
		font-size: 13px;
		font-family: Arial, Helvetica, sans-serif;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		text-align: center;
	}

	.claseBotonPaginado,.claseBotonPaginado:disabled{
		/*display: block;*/
		box-sizing: border-box;
		width: 100%;
		height: 17px;
		margin-bottom:0px;
		padding: 0px;
		padding-top: 0px;
		padding-left: 10px;
		padding-right: 10px;
		/*padding-bottom: 20px !important;*/
		box-sizing: border-box;
	    float: left;
	    text-decoration: none;
	    border-radius: 3px;

		color:#FFFFFF;
	    border: 1px solid #616c78;
	    background-image: initial;
	    background-position-x: initial;
	    background-position-y: initial;
	    background-size: initial;
	    /*background-repeat-x: initial;
	    background-repeat-y: initial;*/
	    background-attachment: initial;
	    background-origin: initial;
	    background-clip: initial;
	    background-color: #3498db;/*rgb(131, 141, 152);*/

	    -moz-box-shadow: inset 0 3px 0px -2px rgba(255, 255, 255, .3);
	    -webkit-box-shadow: inset 0 3px 0px -2px rgba(255, 255, 255, .3);
	    box-shadow: inset 0 3px 0px -2px rgba(255, 255, 255, .3);
	}

	.claseBotonImprimir:hover,.claseBotonAgregar:hover,.claseBoton:hover,.claseBotonEliminar:hover, .claseBotonPaginado:hover {
		/* Color de fondo cuando el curosr está por encima del botón */
		background-color: #3cb0fd;
		/*background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
		background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
		background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
		background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
		background-image: linear-gradient(to bottom, #3cb0fd, #3498db);*/
		text-decoration: none;
	}

	.claseBotonImprimir table, .claseBotonAgregar table, .claseBoton table,.claseBotonEliminar table {
		margin-left: 15px !important;
		margin-right: 15px !important;
	}

	.claseBotonImprimir table tr td a , .claseBotonAgregar table tr td a , .claseBoton table tr td a , .claseBotonEliminar table tr td a,.claseBotonPaginado table tr td a  {
		color:#FFFFFF !important;
		font: 13px "Lato";
		margin: 0px;
		word-wrap: break-word;
	}

	.claseBotonImprimir:disabled,.claseBotonAgregar:disabled, .claseBotonEliminar:disabled,.claseBoton:disabled,.claseBotonPaginado:disabled{
		/*Cambio de apariencia del botón cuando está desahilitado*/
		color: #BABABA;
		border: 1px solid #E9E9E9;
		background-image: none !important;
		background: #F6F8F9 !important; /* F6F8F9*/
		background: -moz-linear-gradient(-45deg,  #f6f8f9 0%, #e5ebee 50%, #d7dee3 51%, #f5f7f9 100%);
		background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#f6f8f9), color-stop(50%,#e5ebee), color-stop(51%,#d7dee3), color-stop(100%,#f5f7f9));
		background: -webkit-linear-gradient(-45deg,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%);
		background: -o-linear-gradient(-45deg,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%);
		background: -ms-linear-gradient(-45deg,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%);
		background: linear-gradient(135deg,  #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#f5f7f9',GradientType=1 );
	}

	.claseBotonImprimir:disabled table tr td a, .claseBotonAgregar:disabled table tr td a, .claseBotonEliminar:disabled table tr td a,.claseBoton:disabled table tr td a,.claseBotonPaginado:disabled table tr td a {
		/*Cambio de apariencia del texto del botón cuando está desahilitado*/
		color:#BABABA; /*  #BABABA;  Gris */
	}


	.claseBotonEliminar, .claseBotonEliminar:hover{
		background-image: url('../librerias/imagenes/eliminar.png');
		background-position: center center ;
		background-repeat:no-repeat;
		width:40px;/* height:25px; */
	}

	.claseBotonAgregar, .claseBotonAgregar:hover{
		background-image: url('../librerias/imagenes/add_white_24dp.svg');
		background-position-x: 0.5rem;
		background-repeat:no-repeat;
		background-size:  1.5rem;
		padding-left: 35px;
		padding-right: 35px;
		/*background-attachment: fixed;*/
		background-color: #4caf50;
		/*width:40px;
		height: 25px;*/

		/*background:url('../librerias/imagenes/add_white_24dp.svg') no-repeat fixed; 
		background-position-x: 0.5rem;
		-webkit-background-size: cover;
		   -moz-background-size: cover;
			 -o-background-size: cover;
				background-size: cover;*/
	}

	.claseBotonEditar, .claseBotonEditar:hover{
		background-image: url('../librerias/imagenes/edit.svg');
		width: 40px;
		height: 25px;
		background-position: center center;
		float: left;
		background-size: 1.1rem;
		background-repeat: no-repeat !important;
	}

	.claseBotonImprimir, .claseBotonImprimir:hover{
		background-image:url('../librerias/imagenes/imprimir_blanco.png');
		background-position: center center;
		background-repeat:no-repeat;
		width:40px;
		height:25px;
	}

	.claseBotonAdjuntar, .claseBotonAdjuntar:hover{
		background-image:url('../librerias/imagenes/adjuntar.png');
		background-position: center center;
		background-repeat:no-repeat;
		width:40px;
		height:25px;
	}

	.claseBotonOK,.claseBotonOK:hover{
		background-image:url('../librerias/imagenes/ok.png');
		background-position: center center;
		background-repeat:no-repeat;
		width:auto;
		height:25px;
	}

	.claseTextoAsterisco{
		/* Clase usada para definir atributos para el asteristo que muestra obligatoriedad de ingreso de datos  */
		color: #FF2727;
		font-size: 14px;
		margin-left: 5px;
		/*padding-top: 3px;*/
		height: auto;
		/*float:;*/
		display: inline-block;
		position:relative;
	}

	.claseNegrita, .claseNegrita *{
		font-weight: bold;
	}

	.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
		font-family: lato;
	}

	/*datepicker*/
	.ui-datepicker {
	 	font-size:13pt !important;
	 }

	.ui-datepicker, .ui-state-default, .ui-state-hover, .ui-state-active{
		/*Cambia el tamaño de letra de los días del mes */
		font-size:10px;
	}
	.ui-datepicker-title{
		/* Cambia el tamaño de letra del mes y año en los datetimepicker */
		padding: 0px;
		padding-right: 0px;
		padding-left: 0px;
		font-size: 12px !important;
		text-align: left;
	}

	/* Barra de progreso */
	.ui-progressbar {
		position: relative;
	 }

	 .progress-label {
	   position: absolute;
	   left: 50%;
	   top: 4px;
	   font-weight: bold;
	   color:white !important;
	   text-shadow: 1px 1px 0 black;
	   z-index: 100 !important;
	 }



	#tbHistorial > div,.tbHistorial > div {
		height: auto;   /* 16em; */
		padding: 5px;
	}

	#tbHistorial,.tbHistorial{
		height: auto;
	}

	.claseDivTitulo{
		color:#000000;
		font: 12px "lato";
		font-weight:bold;
		background: rgb(246,248,249); /* Old browsers */
		background: -moz-linear-gradient(top,  rgba(246,248,249,1) 0%, rgba(229,235,238,1) 50%, rgba(215,222,227,1) 51%, rgba(245,247,249,1) 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(246,248,249,1)), color-stop(50%,rgba(229,235,238,1)), color-stop(51%,rgba(215,222,227,1)), color-stop(100%,rgba(245,247,249,1))); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top,  rgba(246,248,249,1) 0%,rgba(229,235,238,1) 50%,rgba(215,222,227,1) 51%,rgba(245,247,249,1) 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top,  rgba(246,248,249,1) 0%,rgba(229,235,238,1) 50%,rgba(215,222,227,1) 51%,rgba(245,247,249,1) 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top,  rgba(246,248,249,1) 0%,rgba(229,235,238,1) 50%,rgba(215,222,227,1) 51%,rgba(245,247,249,1) 100%); /* IE10+ */
		background: linear-gradient(to bottom,  rgba(246,248,249,1) 0%,rgba(229,235,238,1) 50%,rgba(215,222,227,1) 51%,rgba(245,247,249,1) 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#f5f7f9',GradientType=0 ); /* IE6-9 */
	}

	/* Clase definida en los estilos de los dialog de Jquery UI  */
	/* Se sobreescribe  la clase jqueryUI */
	/* Clase definida para las ventanas flotantes */
	.ui-dialog-titlebar{
		color: white;
		font-size:13px;
	}

	/* Clase definida para definir formato de toolTip de jquery ui*/
	.ui-tooltip{
	    font-size:10pt;
	    font-family:Calibri;
	    background: #666;
	    color: white;
	    border: none;
	    padding: 0;
	    opacity: 1;
	}

	.ui-tooltip-content {
	    position: relative;
	    padding: 0.3em; /*Espaciado entre el filo del tool y el texto  */
	}

	.ui-dialog{
		
		top:15% !important;
        left:0%;
		/*padding: 0px;
		margin: 0px;
		box-sizing: border-box;
		width: auto;*/
	}

	.ui-dialog .ui-dialog-content{
		/* Aplica a la ventana flotante  de jquery ui*/
		/*padding: 0px !important;
		margin: 0px !important;
		box-sizing: border-box !important;*/
	}

	.ui-widget input{
		/*Aplica a los input dentro de un contenedor Jquery ui como lo es jquery dialog */
		font-family: "Lato";
		font-size: 12px;
	}

	/* Aplica estilo de fuente a autocomplete jquery de los input  */
	.ui-widget{
		font-family: "Lato";
	}

	/* Forzar para que se muestre la X en el botón cerrar de los cuadros de diálogo  */
	.ui-dialog-titlebar-close {
		background: url("images/ui-icons_888888_256x240.png") repeat scroll -93px -128px rgba(0, 0, 0, 0);
		border: medium none;
	}
	
	.ui-dialog-titlebar-close:hover {
		background: url("images/ui-icons_222222_256x240.png") repeat scroll -93px -128px rgba(0, 0, 0, 0);
	}

	/* Contenedor de botonera */
	.claseDivBotones{
		display:flex; /*table-cell*/
		justify-content: flex-start;
		align-items: flex-start;
		flex-direction: row;
		max-width: max-content;
	
		position: relative;
		height: auto;
		width: auto;
		padding: 5px;
		border-spacing: 0px;
		box-sizing: border-box;
		text-align: left;
		vertical-align: middle;
	}


	/**
	 * Botón que permite cerrar el div contenedor de botones mostrado en versión movil
	 */
	.claseDivBotonesCerrar{
		width: 25px;
		height: 26px;
		/*right: 20;*/
		right: 0;
		top:-22;
		background: #ec0505;
		background-image: url("../librerias/imagenes/ic_close_white_64dp_1x.png");
		background-repeat: no-repeat;
		background-position: center;
		background-size: 1.9em;
		color: white;
		font-size: 12px;
		vertical-align: middle;
		line-height: 20px;
		font-family: lato;
		position: absolute;
		display: block;
		float: right;
		cursor: pointer;
		z-index: 180;
		-webkit-box-shadow: 2px 4px 8px 0px rgba(50, 50, 50, 0.75);
		-moz-box-shadow:    2px 4px 8px 0px rgba(50, 50, 50, 0.75);
		box-shadow:         2px 4px 8px 0px rgba(50, 50, 50, 0.75);
		-moz-border-radius: 2.5em;
		-webkit-border-radius: 2.5em;
		/*border-radius: 5px 5px 5px 5px;*/
	}

	/* Contenedor de boton, este debe estar dentro del contenedor de la botonera */
	.claseDivBoton{
		display: inline-block;
		margin:0 auto;
		/*float: none;*/
		padding: 0px;
		padding-left: 2px;
		padding-right: 2px;
		border-spacing: 0px;
		text-align: center;
		vertical-align: middle;
		margin-bottom: 2px;
	}

	.claseDivBoton:disabled{
		background-color: white;
	}

	/* *********************************** */
	/* Aplicado a columnas de formulario   */
	/* *********************************** */

	/* Fila contenedora de contenedores */
	.claseDivContenedorFormFila{
		float: left;
		height: auto;
		width: 100%;
		position: relative;
		padding-top: 3px;
		padding-bottom: 3px;
		display: inline-block; /* table Evita que el contenido de este div sobrepasa o rebose al mismo*/
		box-sizing: border-box;
	}

	/* Aplicado a etiquetas  */
	.claseAnchoFormColumna1{
		float:left;
		text-align: left;
		padding:0px;
		margin:0px;
		width:200px !important;
		height:auto;
		display:inline-block; /* Evita que el contenido de este div sobrepasa o rebose al mismo*/
		border-spacing: 0px;
		vertical-align: middle;
	}

	/* Aplicado a textbox, select,etc que se encuentren pegados a la derecha de las etiquetas */
	.claseAnchoFormColumna2{
		text-align: left;
		width:auto;
		height:auto;
		float:left;
		padding-right: 15px;
		display:inline-block; /* Evita que el contenido de este div sobrepase o rebose al mismo*/
	}

	/* Esta clase se usa cuando se tienen div que van a estar uno al lado de otro  */
	.claseDivAutoAjustable {
		float:left;
		width:auto;
		height:auto;
		display: inline-block;  /* Evita que el contenido sobrepase al mismo */
		border-spacing: 0px;
		position: relative;
	}

	/**
	 * Clase aplicada a los div que van a estar uno al lado de otro, agregando un espaciado a la izquierda del mismo
	 */
	.claseDivAutoAjustableSepIzq{
		float:left;
		white-space:nowrap;
		width:auto;
		height:auto;
		display: inline-block;  /* Evita que el contenido sobrepase al mismo */
		margin-left: 5px;
		border-spacing: 0px;
		box-sizing: border-box;
		position: relative;
	}

	/**
	 * Permite añadir un espaciado al costado izquierdo de un contenedor
	 */
	.claseSepIzq{
		padding-left: 5px !important;
	}

	/**
	 * Permite añadir un espaciado al costado superior de un contenedor
	 */
	.claseSepSup{
		/*padding-top: 5px !important;*/
		padding-top: 5px !important;
	}

	.claseSepInf{
		padding-bottom: 5px !important;
	}

	.claseSepDer{
		padding-right:5px !important;
	}

	.claseSinSep{
		padding: 0px !important;
	}


	.claseDivAutoAjustableSepSup{
		float:left;
		white-space: normal;
		width:auto;
		height: auto ;
		display: inline-block;
		box-sizing: border-box;
		position: relative;
		margin-top: 4px;
	}

	.claseColorEtiqueta1{
		color: white !important;
		text-shadow:2px 2px 1px gray;
		background: #ffa500 !important;
		border-color: #ffa500 !important;
	}

	.claseColorEtiqueta2{
		color: white !important;
		background: #196394 !important;
		border-color: #196394 !important;
	}

	.claseColorEtiqueta3{
		color: white !important;
		background: #4caf50 !important;
		border-color: #4caf50 !important;
	}

	.claseColorEtiqueta4{
		color: white !important;
		background: #647488  !important;
		border-color: #647488 !important;
	}

	.claseColorEtiqueta5{
		color: red !important;
		/*font-size: 15px !important;*/
	}

	.claseSubrayado{
		text-decoration: underline;
	}

	/**
	 * Permite aliniear algun elemento o contenedor hacia la izquierda
	 */
	.claseAlineaIzq{
		display: flex;
		align-items: flex-start !important;; /* center items vertically, in this case */ 
		justify-content: flex-start !important;; /* center items horizontally, in this case */
	}

	/**
	 * Permite alinear algun elemento o contenedor hacia la derecha
	 */
	.claseAlineaDer{
		display: flex;
		align-items: flex-end !important;;  /* center items vertically, in this case */ 
		justify-content: flex-end !important;; /* center items horizontally, in this case */
		
	}

	.claseAlineaCen{
		display:flex;
		flex-wrap: wrap;
		align-items: center; /* center items vertically, in this case */ 
		justify-content: center; /* center items horizontally, in this case */
	}

    /**
    *   Permite ocultar objetos html
    */
    .claseOculto{
        display: none;    
    }


	/**
	 * Permite mantener los elementos juntos cuando la pantalla sea más pequeña o antes de que pase a versión móvil
	 * Cada elemento permancerá a lado de otro y no pasará a la siguiente línea hasta que su acompañante tambien lo haga
	 */
	.claseMantenerJunto{
		display: flex;
		float:left;
		width: auto;
		white-space: nowrap;
	}

	/**********************************/
	/* Aplicado a paginado de Grid */
	/**********************************/
	.claseDivContenedorPaginado{
		width:100%;
		height:auto;
		display: inline-block; /* Evita que el contenido sobrepase al mismo */
		border-spacing: 0px;
		border-collapse: collapse;
		margin: 0px;
		background-color:#CACACA;
		padding-top:5px;
		padding-bottom:2px;
		padding-right: 5px;

		/* Se aplica efecto de transición en el div claseContenido cuando a este se le cambia el top o bottom */
		-webkit-transition:all 1s ease;
		-moz-transition:all 1s ease;
		-ms-transition:all 1s ease;
		-o-transition:all 1s ease;
		transition:all 1s ease;
    }

	/* Aplica el tamaño y tipo de texto a las etiquetas encerradas en <a> */
	.claseDivContenedorPaginado a,.claseDivContenedorPaginado label,.claseDivContenedorPaginado select,.claseDivContenedorPaginado input{
		font: 11px "lato" !important;
		color:black;
	}

	.claseDivContenedorPaginado select{
		color:black;
		min-width: 40px;
		width:60;
		height:20px;
		padding:0;
		background-color: white !important;
		border-style: solid;
		border-width: 1px;
		border-color: #bdc3c7 ;
		-webkit-transition: border-color 0.5s ease-in-out;
		transition: border-color 0.5s ease-in-out;
		border-radius:0px;
		outline:none;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		/* Some browsers will not display the caret when using calc, so we put the fallback first */
		background: url("../librerias/imagenes//br_down.png") white no-repeat 50% !important; /* !important used for overriding all other customisations */
		background: url("../librerias/imagenes/br_down.png") white no-repeat calc(100% - 5px) !important; /* Better placement regardless of input width */
		background-size: 10px 10px !important;
	}

	.claseDivContenedorPaginado input{
		color:black;
		min-width: 40px;
		width:60;
		height:20px;
		border-radius: 0px;
		padding:0;
	}

    /* Ajuste a Icono mostrado en el botón */
    .claseDivContenedorPaginadoBotonIcon{
    	float:left;
    	width:auto;
		padding-top: 3px;
    	/*padding-left:3;*/
    }

    /* Ajuste a Icono mostrado en el botón */
    .claseDivContenedorPaginadoBotonTexto{
    	float:left;
    	width:auto;
    	vertical-align: middle;
		padding-left: 0px;
	}

/*****************************************************************************************************
 *
 *	Debajo se colocarán personalizaciones css para botones, contenedores, etiquetas, controles,etc
 *
 ****************************************************************************************************/

	/**
	 * Aplica para div a mostrarse en la pagina crear solicitud
	 */
	#divNuevoSolicitante{
		padding: 5px !important;
		margin-right: 0px;
		margin-bottom: 0px;
		width: 990px;
		display: inline-block;
		box-sizing: border-box !important;
		border:0;
		padding: 0px;
		margin: 0px;
	}

	#divSeleccioneEmpresa{
		width: 990px;
	}


	/**
	 * Muestra un texto que indica que el módulo actual se encuentra en abiente de pruebas
	 */
	#lblTextoPruebaTituloPrincipal{
		-moz-box-shadow: 0px 0px 0px 0px #3dc21b;
		-webkit-box-shadow: 0px 0px 0px 0px #3dc21b;
		box-shadow: 0px 0px 0px 0px #3dc21b;
		background-color:#44c767;
		border: 1px solid #18ab29;
		display:inline-block;
		color:#ffffff;
		font-family:"lato";
		font-size:11px;
		text-decoration:none;
		/*text-shadow:0px 1px 0px #2f6627;*/
		letter-spacing: 0px;
		margin-right: 5px;
		vertical-align: center;
		padding-top: 5px;
		padding-bottom: 5px;
		padding-left: 7px;
		padding-right: 7px;
		box-sizing: border-box;
		/*float:right;*/
		width: auto;
		cursor:default;
	}

	.lblTextoObligatorio{
		-moz-box-shadow: 0px 0px 0px 0px #307CC4;
		-webkit-box-shadow: 0px 0px 0px 0px #307CC4;
		box-shadow: 0px 0px 0px 0px #307CC4;
		background-color:#FFFFFF;
		border:1px solid #FFFFFF;
		display:inline-block;
		position: relative;
		color:#ffffff;
		font-family:"lato";
		font-size:08px;
		width: 100%;
		height: auto;
		text-decoration:none;
		text-shadow:0px 1px 0px #2f6627;
		box-sizing: border-box;
	}

	

	/**
	*  Usado para darle formato al icono de 3 lineas que expande el menú responsive en los telefonos móviles
	*/
	 #btnResponsive	{
  		display:none;
  		float: right;
  	}

	/**
	 *  Usado para darle formato al icono tipo botón de información de usuario
	 */
	#btnDivInfoUsuario {
		background: #0c7fb0;
		border-radius: 50%;
		-moz-border-radius: 2.5em;
		-webkit-border-radius: 2.5em;
		color: #ffffff;
		display: block;
		font-weight: bold;
		line-height: 1.7 em;
		text-align: center;
		/*width: 1.0em;
		height: 1.0em;*/
		width: 28px;
		height: 28px;
		font: 27px lato; /*1.5rem lato; */
		font-weight: bold;
		margin: 0px;
		margin-right:0px;
		float:right;
		position: relative;
		border: 1px solid #0c7fb0;
	}

	#btnDivInfoUsuario:hover{
		background-color:#3CB0FD ; /* #FFAF4B*/
		border: 1px solid #3CB0FD ;
	}

	#claseInfoUsuarioTexto{
		display: inline-block;
		box-sizing: border-box;
		font-size:0.7em;
		padding: 0px;
		margin: 0px;
		padding-top: 2px;
		padding-left: 4px;
		text-align: center;
		width:100%;
		cursor:pointer;
	}

	/**
	 *  Usado para darle formato al icono tipo botón de información de usuario
	 */
	#btnInfoUsuario	{
		/*cursor:pointer;*/
		float: right;
		width: 28px;
		height: 25px;
		text-align: center;
		background-image:url('../librerias/imagenes/ic_perm_identity_black_36dp_1x.png');
		background-repeat: no-repeat;
		background-position: center;
		background-size:cover;
		/*margin-right: 10px;*/
		position: relative;
		background-color: #FFAF4B;
		border: 1px solid #FFAF4B;
	}

	/*#btnInfoUsuario:hover{
		background-color: #0c7fb0;
		border: 1px solid #0c7fb0;
	}*/

	/* Aplica formato al área que se encuentra el inicio de sesión */
	#claseDivInfoUsuario{
		font: 11px lato;
		letter-spacing: normal;
		font-weight: normal;
		text-shadow: none;
		border-radius: 2px;
		background-color: #666;
		background-color: white;
		box-shadow: 0 0 40px #8a8a8a;  /* Microsoft rgba(0,0,0,.24)  */
		color: gray;
		display: none;
		position: fixed;
		float: left;
		top: 50px;
		right:0;
		margin-right: 5px;
		width: 250px;
		z-index: 200;
		height: auto;
	}

	#claseDivInfoUsuario:after{
	  /* Mostrar flecha o indicativo seleccionado */
	  content: '';
	  display: block;
	  width: 0;
	  height: 0;
	  position: absolute;
	  right: 0%;
	  bottom: 100%;
	  border-left: 10px solid transparent;
	  border-right: 10px solid transparent;
	  border-bottom: 10px solid white;
	  margin-right: 4px;

	}

	#claseDivInfoUsuario #btnCerrarSesion,#claseDivInfoUsuario #btnCambiarClave,#claseDivInfoUsuario #btnCambiarAppDefecto,#claseDivInfoUsuario #btnCambiarEmpresa,#btnMisDatos{
		background: inherit;
		font-size: 15px;
		padding-left: 15px !important;
		padding-top: 10px;
		padding-bottom: 10px;
		cursor: pointer;
		box-sizing: border-box;
		display: block;
		border-bottom: 1px;
		border-bottom-color: #8a8a8a;
		border-bottom-style: solid;
	}
	#claseDivInfoUsuario #btnCerrarSesion:hover,#claseDivInfoUsuario #btnCambiarClave:hover,#claseDivInfoUsuario #btnCambiarAppDefecto:hover,#claseDivInfoUsuario #btnCambiarEmpresa:hover, #btnMisDatos:hover{
		background: #0c7fb0;
		color:white;
	}

	#claseDivInfoConexion{
		background-color: #136d94; /*#0FA1E0;*/
		width: auto;
		height: 25px;
		font: 11px "lato";
		color: #FFFFFF;
		letter-spacing: normal;
		font-weight: normal;
		text-shadow: none;
		float: right;
		border: 1px solid steelblue;
		display: table;
		padding-left: 5px;
		padding-right: 5px;
		margin-right: 5px;
	}

	/* Solo aplicable a la etqueta que muestra el nombre del área  */
	#lblArea{
		/*font-weight:bold;*/
	}

	#divGif {
		height:auto;
		visibility: hidden;
		float:right;
		width: 0px;
		margin: 0px;
		padding: 0px;
	}

	#btnApssTituloPrincipal{
		position:relative;
		display:block;
		float:left;
		margin: 0px;
		padding: 0px;
		height:48px;
		width:48px;
		box-sizing: border-box;
		background-color: inherit;
		background-image: url('../librerias/imagenes/apps.png');
		background-size: 2rem;
		background-repeat: no-repeat;
		background-position: center;
		box-sizing: border-box;
	}

	#btnApssTituloPrincipal:hover{
		cursor:pointer;
		background-color:#3CB0FD ;   /*#0c7fb0;*/ /* #FFAF4B;*/
	}

	.claseAccDirectoPrincipal{
		float: right;
		position: fixed;
		letter-spacing: 5px;
		top:13px;
		right: 0px;
		padding-right: 5px;
		box-sizing: border-box;
		display: inline-block;
	}

	#claseDivAppsSistema{
		font: 11px lato;
		letter-spacing: normal;
		font-weight: normal;
		text-shadow: none;
		color: gray;
		padding: 10px;
		/*display:flex;*/
		display: none;
		flex-direction: row;
		align-items: flex-start;
		align-content: flex-start;
		flex-wrap:wrap;
		/*overflow: hidden;*/
		transition: height .3s linear;
		transition: 2s;
		position: absolute;
		top: 58px;
		left:0;
		margin-left:10px;
		z-index: 200;
		/*height: 100%;*/
		max-width: 95vw;
		border-radius: 2px;
		background-color: white;
		box-shadow: 0 0 6px #808080;
	}

	/* Mostrar flecha o indicativo seleccionado */
	#claseDivAppsSistema:after {
		  content: '';
		  display: block;
		  width: 0;
		  height: 0;
		  position: absolute;
		  left: 0%;
		  bottom: 100%;
		  border-left: 10px solid transparent;
		  border-right: 10px solid transparent;
		  border-bottom: 10px solid white;
		  margin-left: 5px;
	}

	#btnSOTApp,#btnRETApp,#btnSMProgApp,#btnCombustibleApp,#btnComprasApp,#btnPowerBI{
		width:100px;
		height:100px;
		margin-right: 5px;
		border:1px solid white;
		background-size: 3rem;
		background-repeat: no-repeat;
		background-position: center;
		background-color:#11476b; /*#3498DB;*/
		box-sizing: border-box;
		text-align: center;
		font-size: 10px;
		font-weight: bold;
		cursor: pointer;
		/*display: table-cell;*/
		display: flex;
		flex-direction: column;
		justify-content: end;
		align-items: center;

		min-width: 100px;
   		vertical-align: bottom;
		padding-bottom: 10px;
		color: white;
		word-wrap: break-word;
		padding-left: 5px;
		padding-right: 5px;
	}

	#btnSOTApp{
		background-image: url('../librerias/imagenes/iconoSOT_blanco.png');
	}

	#btnSOTApp:hover,#btnRETApp:hover,#btnSMProgApp:hover,#btnCombustibleApp:hover,#btnComprasAPP:hover,#btnPowerBI:hover{
		background-color: #3498DB;   /*#0c7fb0;*/
		border: #ffffff 1px solid;
	}

	#btnRETApp{
		background-image:  url('../librerias/imagenes/RET.ico');
	}

	#btnSMProgApp{
		background-image:  url('../librerias/imagenes/icono.ico');
	}

	#btnCombustibleApp{
		background-image:  url('../librerias/imagenes/combustible.ico');
	}

    #btnComprasApp{
		background-image:  url('../librerias/imagenes/shopping_cart_white_24dp.svg');
	}

	#btnPowerBI{
		background-image:  url('../librerias/imagenes/powerbi.png');
	}

	.claseDivContenedorAppDefecto{
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: row;
	}

	.claseDivAppsSistemaDefecto{
		display: flex;
		padding: 5px;
		flex: 0 500px;
		flex-direction: row;
	}

	/**
	 * Usado en frm_appDefecto.php
	 */
	#btnRETDefecto, #btnSOTDefecto, #btnSMProgDefecto,#btnCombustibleDefecto,#btnComprasDefecto{
		height: 100px;
		flex: 1	 400px;
		margin:5px;
		padding-bottom: 30px;
		background-size: 3rem;
		background-repeat: no-repeat;
		background-position: center;
	}

	#btnIngresar{
		margin: 5px;
	}

	#btnSOTDefecto{
		background-image: url('../librerias/imagenes/iconoSOT_blanco.png');
	}

	#btnRETDefecto{
		background-image:  url('../librerias/imagenes/RET.ico');
	}

	#btnSMProgDefecto{
		background-image:  url('../librerias/imagenes/icono.ico');
	}

	#btnCombustibleDefecto{
		background-image:  url('../librerias/imagenes/combustible.ico');
	}

    #btnComprasDefecto{
        background-image:  url('../librerias/imagenes/shopping_cart_white_24dp.svg');
    }

	#btnSOTDefecto span,#btnRETDefecto span, #btnSMProgDefecto span,#btnCombustibleDefecto span,#btnComprasDefecto span{
		width: 100%;
		height: auto;
		display: inline-block;
		cursor: pointer;
		/*padding: 50px;*/
		padding-top: 100px;
		color: white;
		font-size: 13px;
	}

	/**
	 *	Usado en la opcion para registro de ordenes de trabajo
	 */
	#divOTActividades{
		height:auto;
		width: 100%;
		min-height: 185px;
		display: block;
		float: left;
		position: relative;
		box-sizing: border-box;
	}

	#divOTActividades_detalle{
		padding-right: 0px;
	    float: left;
		height: auto;
		max-height: 400px;
		display: inline-block;
		position: relative;
		overflow-y:scroll;
		overflow-x: hidden;
		width: 100%;
	}

	.claseDivNumActividades{
		width: 100%;
		height: 25px;
		display: inline-block;
		position: relative;
		float: left;
		background: #647488;
	}

	.claseDivNumActividades label{
		color:white;
	}

	#claseInfoNumActividades{
		display: table;
		vertical-align: middle;
		height: 100%;
	}

	#claseInfoNumActividades>span{
		font-size: 13px;
		color: white;
		display: table-cell;
		vertical-align: middle;
		height: 100%;
	}

	#claseInfoNumActividades>.claseContadorActividad{
		display: table-cell;
		vertical-align: middle ;
		float: none;
	}

	.claseContadorActividad{
		position: relative;
		float:left;
		display: inline-block;
		vertical-align: middle;
	}

	.claseContadorActividad span{
		background: #0c7fb0;
		border-radius: 50%;
		-moz-border-radius: 2.5em;
		-webkit-border-radius: 2.5em;
		color: #FFFFFF;
		display: inline-block;
		font-weight: bold;
		line-height: 0.1rem;
		text-align: center;
		width: 1.2rem;
		height: 1.2rem;
		font: 0.7rem Lato;
		font-weight: bold;
		padding-top: 2.5px;
		box-sizing: border-box;
		position: relative;
		border: 1px solid #0c7fb0;
	}

	/**
	 * Botón flotante que permite muestra los botones para realizar mantenimiento a las opciones de los formularios
	 */
	.crudBoton{
		right:17;
		display: none;
		position: fixed;
		bottom:2;
		background-color:#ef7d00;
		width:50px;
		height:50px;
		border-radius:100%;
		background:#ef7d00;/*26a69a*/  /*Rojo Flat F44336 */
		border:none;
		outline:none;
		color:#FFF;
		font-size: 18px;

		box-shadow: 10px 20px 18px rgba(0,0,0,0.16), 10px 20px 18px rgba(0,0,0,0.23);
		transition:.3s;
		-webkit-tap-highlight-color: rgba(0,0,0,0);
	}

	.crudBoton:hover,.claseDivBotonesCerrar:hover{
		background-color:#3CB0FD;
		cursor: pointer;
	}

	#claseDivEditarOT{
		font: 11px lato;
		letter-spacing: normal;
		font-weight: normal;
		text-shadow: none;
		border-radius: 2px;
		background-color: #666;
		background-color: white;
		box-sizing: border-box;
		box-shadow: 0 0 6px #8a8a8a;  /* Microsoft rgba(0,0,0,.24)  */
		color:gray;
		padding: 10px;
		display: none;
		position: absolute;
		top: 40px;
		z-index: 200;
		width: auto;
		height: auto;
	}

	/* Mostrar flecha o indicativo seleccionado */
	/*#claseDivEditarOT:after {
		content: '';
		display: block;
		width: 0;
		height: 0;
		position: absolute;
		left: 0%;
		bottom: 100%;
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
		border-bottom: 10px solid white;
		margin-left: 45px;
	}*/

	#divTriangulo{
		width: 95px;
		height: 30px;
		bottom: 72px;
		left: 25px;
		z-index: 0;
		position: absolute;
		overflow: hidden;
		box-shadow: 0 16px 10px -15px rgba(0,0,0,0.5);
	}

	#divTriangulo:after{
		content: "";
		position: absolute;
		width: 25px;
		height: 22px;
		background: white;
		transform: rotate(45deg);
		-ms-transform:rotate(45deg); /* IE 9 */
		-moz-transform:rotate(45deg); /* Firefox */
		-webkit-transform:rotate(45deg); /* Safari and Chrome */
		-o-transform:rotate(45deg); /* Opera */
		top: 25px;
		left: 25px;
		box-shadow: -1px -1px 10px 0px rgba(0,0,0,0.5);
	}

	/* Se Modifica el label ubicado dentro de claseDivEditarOT */
	#claseDivEditarOT label{
		margin: 0;
		display: inline-block;
		float: left;
		position: relative;
		font-size: 0.6rem;
		font-weight: bold;
		vertical-align: middle;
		word-wrap: break-word;
		padding-top: 5px;
		padding-left: 5px;
		padding-right: 5px;
		padding-bottom: 5px;
		color: white;
		box-sizing: border-box;
		height: auto;
		width: auto;
		cursor: pointer;
	}

	#btnEditarPreventiva,#btnEditarCorrectiva {
		width:130px;
		height: auto;
		float: left;
		box-sizing: border-box;
		display:none;
	}

	#lblContOTC, #lblContOTP{
		position: relative;
		width: auto;
		box-sizing: border-box;
		display: inline-block;
	}

	.claseFondoActividades-OTP{
		background: #e5ebee;
		margin-bottom: 15px;
		box-sizing: border-box;
		display: inline-block;
		margin-right:5px;
		float: left;
		position: relative;
	}


	/* Cotizaciones  */
	#contenedorBotonArchivo {
		font-family: 'Lato';
		cursor:pointer;
		height:auto;
		/*width: 150px;*/
		box-shadow: 2px 2px 2px #666;
		/*flex:content;*/
		display :inline-flex;
		align-items: center;
	}

	/*Seteo de icono Adjuntar*/
	#contenedorBotonArchivo #lblIconoAdjuntar{
		background-image:url("../librerias/imagenes/adjuntar.png");
		background-position:center center;
		background-repeat:no-repeat;
		width:30px !important;
		height:25px;
		display:inline-block;
	}

	#contenedorBotonArchivo #lblNomArchivo{
		display:inline-block;
	}
	

	/*Seteo de icono eliminar*/

	#contenedorBotonArchivo #btnEliminarArchivo{
		background-image:url("../librerias/imagenes/eliminar.png");
		background-position:center center;
		background-repeat:no-repeat;
		width:40px !important;
		height:25px;
		background-color:#bb2f2f;
		display:inline-block;
		cursor:pointer;
	}
		
	#contenedorBotonArchivoDescPlantilla{
		height : auto;
		border-top: 5px;
		border-left: 5px;
		border-right: 5px;
		border-style: solid;
	}

	#contenedorBotonArchivoDescPlantilla:hover{
		background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
		background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
		background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
		background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
		background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
	}

	/* Se oculta por defecto la seccion de componentes de la SOT */
	#divComp{
		display:none;
	}

    #gridEquipo{
        height: 300px;
        background-color: #d4d4d4;
        padding-top: 5px;	
        margin-bottom: 10px;
    }

    #grdEquipo{
        /*border: 1px solid gray;*/
        height: inherit;
        overflow: scroll;
        padding-top: 5px;
        padding-left: 5px;
        padding-right: 5px;
        background-color: inherit;
                
    }

    #filaEquipo{
        background-color:white;
    	margin-right: 10px !important; 
		border-spacing: 0px;
        /*margin-top: 5px;*/
		margin-bottom: 5px;
        padding: 3px;
        min-width:380px;
        max-width:480px;
		border-collapse:separate; /* Evita que el borde afecte el interior del contenedor */
	  	display: inline-block;
		border: 0px solid #CCCCCC;  /* Color del borde */
		/*-webkit-box-shadow: 2px 4px 8px 0px rgba(50, 50, 50, 0.75);
		-moz-box-shadow:    2px 4px 8px 0px rgba(50, 50, 50, 0.75);
		box-shadow:         2px 4px 8px 0px rgba(50, 50, 50, 0.75);*/
        
    }

.claseBotonMostrarMas {
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #f6f6f6));
	background:-moz-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-webkit-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-o-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-ms-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0);
	background-color:#ffffff;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #dcdcdc;
	display:inline-block;
	cursor:pointer;
	color:black;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	/*padding:6px 24px;*/
	text-decoration:none;
	text-shadow:0px 1px 0px #ffffff;
}
.claseBotonMostrarMas:hover {
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f6f6f6), color-stop(1, #ffffff));
	background:-moz-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-webkit-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-o-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-ms-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:linear-gradient(to bottom, #f6f6f6 5%, #ffffff 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#ffffff',GradientType=0);
	background-color:#f6f6f6;
}
.claseBotonMostrarMas:active {
	position:relative;
	top:1px;
}

	[id^="#lblEquipo"] {
		font-size: 18px;
	}

	.claseBotonRefrescar {/*,.claseBotonRefrescar:hover{*/
		background-image: url('../librerias/imagenes/sync_white_24dp.svg');
		width: 40px;
		height: 25px;
		background-position: center center;
		float: left;
		background-size: 1.1rem;
		background-repeat: no-repeat !important;
	}
	.claseBotonRefrescar:disabled{
		background-color:#f6f6f6;
	}

	.claseContainerFila{
		display: flex;
		list-style: none;
		align-content: flex-start;
		justify-content:space-evenly;
	}
	
	.claseContainerWrap{
		display: flex;
		flex-wrap: wrap;
		align-content:flex-start;
		justify-content: flex-start;

		/* Se aplica efecto de transición en el div claseContenido cuando a este se le cambia el top o bottom */
		-webkit-transition:all 1s ease;
		-moz-transition:all 1s ease;
		-ms-transition:all 1s ease;
		-o-transition:all 1s ease;
		transition:all 1s ease;
	}

	#grdDetalle{
		float:left;
	}

	/* Formulario flex-box sin media query */
	.flex-outer{
		list-style-type: none;
		padding: 0;
		max-width: 800px;
		margin: 0 auto;

		display: flex;
	}

	.listaHorizontal{
		display: flex;
		flex-direction: row;
	}

	.flex-outer li{
		list-style-type: none;
		display: flex;
		flex-wrap: wrap;
		/*align-items: center;*/
		align-items: baseline;
	}
	
	.flex-outer> li > .claseLabel{
		flex: 1 0 120px;
  		max-width: 220px;
	}

	.flex-outer > li > input, .flex-outer > li > div {
		flex: 1 0 220px;
	}

	.flex-outer > li:not(:last-child) {
		margin-bottom: 20px;
	}

 	#pnlDetalle{
		display: flex;
		flex: 	4;
		flex-direction: column;
		align-content: flex-start;
		align-items: stretch;
		transition: all 1s ease-out !important; 
	}

	#pnlFiltros{
		/*width:00px;*/
		width:300px;
		height: 100%;
		display: block;
		/*display: flex;*/
		/*flex: 1;
		align-content: flex-start;
		flex-direction: column;*/
		/*transition: all 1s ease-out !important;*/
	}

	#pnlBarraMostrar{
		/*width: 100%;*/
		width:40px;
		height: 25px;
		/*transition: all 0.5s ease-out !important;*/
		/*display: inline-flex;*/
		display: none;
		/*margin-right: 5px;*/
		/*
		padding-left:5px;
		box-sizing: content-box;
		overflow:visible;
		border-collapse: collapse;
		*/
	}

	#btnMostrar{
		width: 40px;
		height: 25px;
		/*background-color: #2a8bcc;*/
		display: inline-flex;
		background-image: url('../librerias/imagenes/filter_alt_white_24dp.svg');
		background-position: center center;
		background-repeat:no-repeat;
		background-size: 1.1rem;
		align-content: center;
		fill:white;
		/*margin: 5px;*/
		cursor: pointer;
		color:white;
		font-family: lato;
		font-size: 30px;
		/*padding-left: 5px;
		padding-right: 5px;*/

	}

	.botonCerrar {
		font-size: 16px;
		padding-left: 5px;
		padding-right: 5px;
		float:right;
		position: relative;
		overflow:visible;
		border-collapse: collapse;
		/*height: 25px;*/
		cursor:pointer;
	}

	.botonCerrar:hover{
		background: #3cb0fd;
		background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
		background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
		background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
		background-image: -o-linear-gradient(top, #3cb0fd, );
		background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
		text-decoration: none;
	}

	.clase2columnas{
		display: flex;
		/*flex-wrap: wrap;*/
		/*align-content: stretch;*/
		/*justify-items: space-between;*/
		flex: 2;
		align-items: center;
	}

	.clase3columnas{
		display: flex;
		/*flex-wrap: wrap;*/
		/*align-content: stretch;*/
		/*justify-items: space-between;*/
		align-items: center;
		flex: 3;
	}

	.clase1columna{
		display: flex;
		/*flex-wrap: wrap;*/
		flex-direction: column; 
		/*justify-content: center;*/
		width: auto;
		flex:1;
	}

	.claseWrap{
		flex-wrap: wrap;
	}

	
	.claseColumna{
		display:flex;
		flex-direction:column;
	}

	.claseFila{
		display:flex;
		flex-direction:row;
		
	}

	/**
	 * Aplica para div a mostrarse en la pagina crear solicitud
	 */
	 #divEditarSOT{
		padding: 5px !important;
		margin-right: 0px;
		margin-bottom: 0px;
		width:0px;
		height: 0px;
		top:5% !important;
  		position: relative;
		display: none;
		justify-content: center; /*centers items on the line (the x-axis by default)*/
		align-items: center; /*centers items on the cross-axis (y by default)*/
		border: 0;
		box-sizing: border-box;
	}

	#divAnular{
		padding: 5px !important;
		margin-right: 0px;
		margin-bottom: 0px;
		width:0px;
	}

	.claseFondoListadoSOT{
		/*background: #e5ebee;*/
		background: #c5dcec;
		margin-bottom: 5px;
		box-sizing: border-box;
		display: inline-block;
		margin-right:5px;
		padding: 5px;
		position: relative;
		display: flex;
		flex-direction: column;
  		justify-content: space-between;
        border:  1px solid #9ca0dd;
        border-radius: 0.2rem;
	}
	
	.clasePanelAjustado{
		background: #e5ebee;
		margin-bottom: 5px;
		box-sizing: border-box;
		display: inline-block;
		margin-right:5px;
		float: left;
		position: relative;
		display: flex;
		flex-direction: column;
  		justify-content: space-around;
	}

	/* Cambia el color del fondo */
	.claseSOTPrioridadRoja{
		background-color:red;
		color:white;
	}		
	
	/* Cambia el color de la fuente */
	.claseSOTPrioridadRoja :last-child{
		color:white;
	}

	

	.claseInvisible{
		display: none !important;
	}

	#contenedorPadrePrioridad{
		display:flex;
	}

	.claseTachado{
		text-decoration: line-through;
	}

	#grdSOTDetalle{
		min-height: 400px;
	}

	.claseListadoProv{
		flex-basis: 100%;
		text-align: center;
		border: 1px solid gray;
		margin-bottom: 10px;
	}

	#filaObservacion{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around;
		padding-top: 5px;
	}

	.claseListadoProv #txtObservacion{
		background-color: beige;
	}

	#filaDatosProv{
		
		align-items: flex-start;
		display: flex;
		justify-content: space-between;
		border:1px solid #CCCCCC;
		border-bottom-style: solid;
		border-bottom-width: 1px 0px 0px;
		/*align-content: space-around*/
	}

	#filaDatosProv>div{
		/*word-wrap: break-word;*/
		flex-grow: 1;
		flex-shrink: 1;
		flex-basis: 0;
		text-align: left;
	}

	.claseListadoEmpresa{
		display:flex;
		flex-direction:row;
		padding:5px;
		align-content:center;
		justify-content:center;
		height:25px;
		width:600px;
	}

	#txtTicket{
		font-size:20px;	
		color:blue;
	}

	/* Clases usadas en la pantalla Seleccione empresa */
	#feedback { font-size: 1.4em; }
	#lstEmpresa {
		display: flex;
		flex-direction: column;
		align-items: center;
		flex: 1 100%;
	}
	
	#lstEmpresa .ui-selecting { background: #FECA40; }
	#lstEmpresa .ui-selected { background: #F39814; color: white; }
	#lstEmpresa { 
		list-style-type: none;
		margin: 0; 
		padding: 0; 
		/*width: 60%;*/
	}

	#lstEmpresa li { 
		margin: 3px;
		padding: 0.4em; 
		font-size: 1.4em; 
		height: auto;
		/*width: 50%;*/
		font-family:Lato;
		box-sizing: content-box;
	}
	
	#lstEmpresa li:hover{
		cursor: pointer;
		font-family:Lato;
	}

	#divUtlimosDatos > *{
		font-size: 25px;
	}
	
	/* Toogle cechkbox */
	/* https://programacion.net/articulo/como_crear_un_toggle_switch_utilizando_css_1739 */
	
	/* Css para Switch reemplazo de checkbox */
	.switchBtn {
		position: relative;
		/*display: inline-block;*/
		display: flex;
		/*flex-direction: row;*/
		width: 40px;
		height: 20px;
		
	}
	.switchBtn input {display:none;}

	.slide {
		position: absolute;
		cursor: pointer;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: #ccc;
		-webkit-transition: .4s;
		transition: .4s;
		padding: 8px;
		color: #fff;
	}
	.slide:before {
		position: absolute;
		content: "";
		height: 15px;
		width: 15px;
		left: 20px;
		bottom: 3px;
		background-color: white;
		-webkit-transition: .4s;
		transition: .4s;
	}

	input:checked + .slide {
		background-color:#3498DB;
		padding-left: 20px;
	}
	input:focus + .slide {
		box-shadow: 0 0 1px #01aeed;
	}
	input:checked + .slide:before {
		-webkit-transform: translateX(26px);
		-ms-transform: translateX(26px);
		transform: translateX(26px);
		left: -22px;
	}

	.slide.round {
		border-radius: 25px;
	}
	.slide.round:before {
		border-radius: 50%;
	}

    .redondeado{
        border-radius: 10px;
        border:1px solid b9b9b9;
    }

	.filaEncima:hover{
		background: #f2f6f8;
		background: -moz-linear-gradient(top, #f2f6f8 0%, #d8e1e7 48%, #b5c6d0 51%, #e0eff9 100%);
		background: -webkit-gradient(left top, left bottom, color-stop(0%, #f2f6f8), color-stop(48%, #d8e1e7), color-stop(51%, #b5c6d0), color-stop(100%, #e0eff9));
		background: -webkit-linear-gradient(top, #f2f6f8 0%, #d8e1e7 48%, #b5c6d0 51%, #e0eff9 100%);
		background: -o-linear-gradient(top, #f2f6f8 0%, #d8e1e7 48%, #b5c6d0 51%, #e0eff9 100%);
		background: -ms-linear-gradient(top, #f2f6f8 0%, #d8e1e7 48%, #b5c6d0 51%, #e0eff9 100%);
		background: linear-gradient(to bottom, #f2f6f8 0%, #d8e1e7 48%, #b5c6d0 51%, #e0eff9 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f6f8', endColorstr='#e0eff9', GradientType=0 );
	}

	.cursorBoton:hover{
		cursor:pointer;
	}
	.cursorBoton label:hover{
		cursor:pointer;
	}

	/* No permitir seleccionar texto */
	.noselect > * {
		-webkit-touch-callout: none; /* iOS Safari */
		  -webkit-user-select: none; /* Safari */
		   -khtml-user-select: none; /* Konqueror HTML */
			 -moz-user-select: none; /* Old versions of Firefox */
			  -ms-user-select: none; /* Internet Explorer/Edge */
				  user-select: none !important; /* Non-prefixed version, currently
										supported by Chrome, Edge, Opera and Firefox */
	}
	
	.claseColorEtiqueta3:disabled {
		background:gray !important;
		border-color:gray !important;
	}

	  .claseColorFondoRojoBajo{
		background-color: #ff707087;
		color:black;
	}

	.claseColorFondoNaranjaBajo{
		background-color: #f5ab4991;
		color:black;
	}
	
	.claseColorFondoVerdeBajo{
		background-color: #74ce68e3;
		color:black;
	}

	.claseColorFondoVerdeBajo:hover{
		background-color: #7ff070e9;
		color:black;
	}
	
	.claseColorFondoAmarilloBajo{
		background-color: #fff174e3;
		color:black;
	}
	
	.claseColorFondoItems{
		background-color: #c8e5f3; /*#d0d6d9;*/  /*#0070bd;*/
		color:black;
	}

	.claseColorFondoVerde{
		background-color:#4caf50;
		color:white;
	}

	.claseColorFondoVerde:hover{
		background-color:#5ecd62 ;
		color:white;
	}

	.claseColorFondoRojo{
		background-color:#df1d12;
		color:white;
	}

	.claseColorFondoRojo:hover{
		background-color:#fd625a;
		color:white;
	}

	.claseColorFondoNaranja{
		background-color:#e18b00 !important;
		color:white;
	}

	.claseColorFondoNaranja:hover{
		background-color:#ecab43 !important;
		color:white;
	}
	
	.claseEspacioEntreItems{
		display: flex;
		justify-content:   space-between;
	}



	/* https://developer.mozilla.org/es/docs/Web/CSS/CSS_Grid_Layout/Auto-placement_in_CSS_Grid_Layout */
	dl {
		font-family: 'Lato';
		font-size: 14px;
		display: grid;
		grid-template-columns: auto 1fr;
		max-width: 300px;
		min-width: 100px;
		margin: 0.5em;
		line-height: 1.4;
        z-index: 10;
	}

    dt {
		grid-column: 1;
	}

	dd {
		 grid-column: 2;
		 font-weight: bold;
	}
	
    .dt {
		grid-column: 1;
		
	}

	.dd {
		 grid-column: 2;
		 font-weight: bold;
	}

	.itemRep:after {
		content: "";
		/*background: url(/librerias/imagenes/build-black-18dp.svg);*/
		background-size: 100px 100px;
		background-repeat: no-repeat;
		background-position-x: right;
        background-position-y: bottom;
		opacity: 0.1;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		position: absolute;
	  }
      
      .itemAct:before {
		font-family: Lato;
        font-size: 20px;
        font-weight: bold;
        color:#999;
        counter-increment: contador_actividad;
        content: "#" counter(contador_actividad);
        top: 5;
		right: 5;
        position: absolute;
        background-position-x: right;
        background-position-y: top;
		z-index: 1;  
	  }

      .itemAct:after{
        content: "";
		/*background: url(/librerias/imagenes/engineering_black_18dp.svg);*/
		background-size: 100px 100px;
		background-repeat: no-repeat;
		background-position-x: right;
        background-position-y: bottom;
		opacity: 0.1;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		position: absolute;
      }

      #grdDetalle{
        counter-reset: contador_actividad;   
      }

	  /* Items de Repuestos en Módulo de compras */
	  .claseItemRep{
		 	display: flex;
			border:1px solid gray;
			flex-direction: row ;
			flex-wrap:wrap;
			margin: 5px;
			box-shadow: 2px 4px 8px 0px rgb(50 50 50 / 40%)
	  }

	  .claseItemRepEtiq{
		display: flex;
		width: 200px;
		flex-grow: 4;
		min-width: 200px;
	  }

	  .claseItemRepIcon{
			content: "";
			background: url(/librerias/imagenes/build-black-18dp.svg);
			background-size: 50px 50px;
			background-repeat: no-repeat;
			transform: scaleX(-1);
			opacity: 0.5;
			min-width: 50px;
			background-position: center; 
			height: 100%;
			padding: 5px;
	   }
	 
		.claseItemRepDescripcion{
			display: grid;
			/*max-width: 300px;	
			width: 400px;*/
		}

		.claseItemRepDescripcion > div > label,.claseItemRepDescripcion > div > span{
			font-size: 12px;
		}
	
		.claseItemRepDesc > label{
			font-size: 14px !important;
			font-weight: bold;
		}

	  .claseItemRepCant{
			display: flex;
			justify-content: center;
			align-items: center;
			width: auto;
			padding: 10px;
			flex-grow: 1;
	  }

		.claseItemRepNumber{
			width: 90px;
			text-align: right;
		}

	  .claseItemRepObs{
			padding: 5px;
			display: flex;
			justify-content: center;
			align-content: center;
			align-items: center;
			flex-grow: 2;
	  }

	  .claseItemRepBotones, .claseItemRepBotones > button{
		  width: 40px;
	  }

	  .claseItemRepBotones > * {
			background-color: #963030;
	  }

	   /* Items de Proveedores en Módulo de compras */
	   .claseItemProv{
			display: flex;
			border:1px solid gray;
			flex-direction: row ;
			flex-wrap:wrap;
			margin: 5px;

			-webkit-box-shadow: 2px 4px 8px 0px rgba(50, 50, 50, 0.40);
			-moz-box-shadow:    2px 4px 8px 0px rgba(50, 50, 50, 0.40);
			box-shadow:         2px 4px 8px 0px rgba(50, 50, 50, 0.40);
		}

		.claseItemProv > div{
			/*width: 30%;*/
			/*border:1px solid gray;*/
		}

		.claseItemProvEtiq{
			display: flex;
			width: 200px;
			flex-grow: 4;
			min-width: 200px;
		}

		.claseItemProvIcon{
			content: "";
			background: url(/librerias/imagenes/business_black_24dp.svg);
			background-size: 15px 15px;
			background-repeat: no-repeat;
			opacity: 0.5;
			
			background-position: center; 
			display: flex;
			width: 30px;
			height: 15px;
			min-width: 20px;
		}

		.claseItemProvDescripcion{
			display: flex ;
			/*max-width: 300px;	
			width: 400px;*/
			flex-direction:column;
		}

		.claseItemProvDescripcion > div > label{
			font-size: 11px;
		}

		.claseItemProvDescripcion > div{
			display: flex;
			flex-direction: row;
		}

		.claseItemProvDescripcion .claseProvDesc > label {
			font-size: 15px;
			font-weight: bold;
		}

		.claseItemProvTelfIcon{
			content: "";
			background: url(/librerias/imagenes/phone_black_24dp.svg);
			background-size: 15px 15px;
			background-repeat: no-repeat;
			opacity: 0.5;
			
			background-position: center; 
			display: flex;
			width: 30px;
			height: 15px;
			min-width: 20px;
		}

		.claseItemProvCorreoIcon{
			
			content: "";
			background: url(/librerias/imagenes/alternate_email_black_24dp.svg);
			background-size: 15px 15px;
			background-repeat: no-repeat;
			opacity: 0.5;
			
			background-position: center; 
			display: flex;
			width: 30px;
			height: 15px;
			min-width: 20px;
		}


		.claseItemProvBotones {
			padding: 5px;
			display: flex;
			justify-content: right;
			align-content: center;
			align-items: center;
			/*flex-grow: 1;*/
		}

		.claseItemProvBotones, .claseItemProvBotones > button {
			width: 40px;
		}
  
	.claseItemProvBotones >* {
			background-color: #963030;
	}


	/*Agrega formato a los items que especifican que Agregar items a un panel*/
	.claseAgregarItem > *{
		font: 28px  Roboto;
		color:gray;
		margin: 20px;
	}

	.claseAgregarItem > button {
		padding: 0;
		border: none;
		background: none;
		cursor: pointer;
		
	}

	.claseAgregarItem > button:hover{
		font-weight: bold;
	}
	
	.claseAgregarItem > button[disabled]:hover {
		font-weight: normal;
		cursor:default;
	}

	.claseAgregarItem > button:hover > * {
		font-weight: bold;

	}
	/********************************/
  	.ui-autocomplete { width: 70vw; height: 200px; overflow-y: scroll; overflow-x: scroll;}
	/********************************/

	#txtNSolicitud{
		font-size: 17px;
		text-align: center;
	}


	 /* Items de Detalle en general en Módulo de compras */
	 .claseItem{
		display: flex;
		border:1px solid #80808045;
		flex-direction: row ;
		flex-wrap:wrap;
		margin:5px;
		padding-left: 5px;
		padding-right: 5px;
		padding-bottom: 5px;

		-webkit-box-shadow: 2px 4px 8px 0px rgba(50, 50, 50, 0.40);
		-moz-box-shadow:    2px 4px 8px 0px rgba(50, 50, 50, 0.40);
		box-shadow:         2px 4px 8px 0px rgba(50, 50, 50, 0.40);
		font-family: lato;
	}

	.claseItem #lblOC{
		font-size: 17px;
	}

	.claseSinHV{
		cursor:default !important;
		text-decoration:none !important;
		color:black !important;
	}


	#lblOC,.lblProveedorCalif,.hv{
		cursor:pointer;
		color:blue ;
		text-decoration:underline;
	}

	.icono_arriba_rojo{
		display: inline-block;
		height: 20px;
		width: 20px;
		background-image: url('../librerias/imagenes/arrow_upward_red_24dp.svg');
		background-position: center center;
		background-size: 1.1rem;
		background-repeat: no-repeat !important;
		fill:red;
	}

	.icono_abajo_verde{
		display: inline-block;
		height: 20px;
		width: 20px;
		background-image: url('../librerias/imagenes/arrow_downward_green_24dp.svg');
		background-position: center center;
		background-size: 1.1rem;
		background-repeat: no-repeat !important;
		fill:red;
	}

	.icono_guion_negro{
		display: inline-block;
		height: 20px;
		width: 20px;
		background-image: url('../librerias/imagenes/remove_FILL0_wght400_GRAD0_opsz24.svg');
		background-position: center center;
		background-size: 1.1rem;
		background-repeat: no-repeat !important;
		fill:red;
	}


	.claseTextModificado{
		background-color: beige;
		font-weight: bold;
	}

	.equipoFoto{
		max-height: 150px;
	}

	.lblFoto{
		max-height: 120px;
	}

	.sinFoto{
		background-color:#f3f4f6;
	}

	.sticky{
		position: sticky;
		z-index: 1;
		left:0;
		top: 1;
	}

	/*.claseGrid td .sticky{
		position: sticky;
		left:0;*/
		/*z-index: 1;*/
		/*background: white;*/
	/*}*/

	/*.claseGrid  .sticky{
		position: sticky;
		left:0;
		background: white;
	}*/

	/*.js-example-basic-single{
		width: 50%;
	}*/


	/* Tamaño personalizado para los checkbox */

	/*.checkbox-lg .custom-control-label::before, 
	.checkbox-lg .custom-control-label::after {
		top: .8rem;
		width: 1.55rem;
		height: 1.55rem;
	}

	.checkbox-lg .custom-control-label {
		padding-top: 13px;
		padding-left: 6px;
	}


	.checkbox-xl .custom-control-label::before, 
	.checkbox-xl .custom-control-label::after {
		top: 1.2rem;
		width: 1.85rem;
		height: 1.85rem;
	}

	.checkbox-xl .custom-control-label {
		padding-top: 23px;
		padding-left: 10px;
	}*/

	/* Amplia el tamaño del los input checkbox */
	.big-checkbox {width: 20px; height: 20px;}

	/* Corrección para alinear checkbox dentro del acordión */
	.accordion--custom .accordion-header {
		display: flex; /* make flex element */
		align-items: center; /* aligning child items */
		column-gap: 1rem; /* adding gap between items in row */
		padding-left: 1rem;
		box-shadow: inset 0 calc(var(--bs-accordion-border-width) * -1) 0 var(--bs-accordion-border-color);
	}
	  
	/* small udjustments */
	.accordion--custom .accordion-header .accordion-button {
		padding-left: 0;
		background: none;
	}
	  
	.accordion--custom .accordion-button:not(.collapsed) {
		box-shadow: none;
	}
	/***********************************************************/


	/** Reduce el alto en pixeles del acordión */
	.accordion-button{
		padding: 5px;
		margin: 0px;
	}

	#panelsStayOpen-headingOne > *{
		/*background-color: rgb(255, 102, 0);*/
		font-weight: 600;
	}

	/*.ui-autocomplete-input, .ui-menu, .ui-menu-item {
		z-index: 2006;
	}*/

	.ui-autocomplete {z-index: 1061 !important;}