@charset "utf-8";
/* CSS Document */

@font-face {
	font-family: Lato;
	src: url(../fonts/Lato-Regular.ttf);
}

@font-face {
	font-family: Lato;
	src: url(../fonts/Lato-Bold.ttf);
	font-weight: bold;
}

@font-face {
	font-family: Lato;
	src: url(../fonts/Lato-Light.ttf);
	font-weight: light;
}

/*******************************************************************************************************************************************
													configuracion de etiquetas - template
*******************************************************************************************************************************************/

html, body {
	font-family: 'Lato', cursive, sans-serif;
	color: #b2b2b2;
}

html {
	position: relative;
	min-height: 100%;
	background-color: #262626;
}

body {
	margin-bottom: 120px;
}

td, th {
	vertical-align: middle !important;
	font-size: 15px;
}

.w3-table td,
.w3-table-all td {
	font-weight: bold;
	color: #fff;
}

.picker__table td, .picker__table th {
	font-size: 1em;
}

h1, h2, h3, h4, h5, h6, .w3-slim, .w3-wide {
	font-family: 'Lato', cursive, sans-serif;
	color: #b2b2b2;
}

img {
	margin-bottom: 0px;
}

fieldset {
	min-width: 0px;
}

/*******************************************************************************************************************************************
													configuracion de etiquetas - template
*******************************************************************************************************************************************/

/*******************************************************************************************************************************************
													configuracion de clases - template
*******************************************************************************************************************************************/

.w3-input,
.w3-select,
.w3-textarea {
	background-color: #fff;
	border: 2px solid #b2b2b2 !important;
	font-weight: bold;
	border-radius: 6px;
	color: #565655;
	font-size: 15px;
}

.w3-textarea {
	max-width: 100%;
    min-width: 100%;
	padding: 8px;
}

.w3-input.ng-valid,
.w3-select.ng-valid,
.w3-textarea.ng-valid,
.w3-input.isOptional-valid,
.w3-select.isOptional-valid,
.w3-textarea.isOptional-valid {
	color: #b2b2b2;
	background-color: transparent;
	border-color: #b2b2b2 !important;
}

.w3-input.ng-valid:focus,
.w3-select.ng-valid:focus,
.w3-textarea.ng-valid:focus,
.w3-input.isOptional-valid:focus,
.w3-select.isOptional-valid:focus,
.w3-textarea.isOptional-valid:focus {
	color: #0093d9;
	border-color: #0093d9 !important;
}

.w3-input.isDisabled,
.w3-select.isDisabled,
.w3-textarea.isDisabled {
	color: #b2b2b2;
	background-color: transparent !important;
	border-color: #b2b2b2 !important;
}

.w3-select option[disabled] {
	color: #ccc;
}

.wrpCapitalize {
	text-transform: uppercase;
}

.wrpLowerCase {
	text-transform: lowercase;
}

.wrpCampoError,
.w3-input.isDisabled.wrpCampoError,
.w3-select.isDisabled.wrpCampoError,
.w3-textarea.isDisabled.wrpCampoError {
	background-color: #f6b9ae !important;
}

.wrpCampoConIcono {
	position: relative;
	margin: 0px;
}

.wrpCampoConIcono .w3-input {
	padding-left: 40px;
}

.wrpCampoConIcono .iconoCelda {
	position: absolute;
	width: 30px;
	height: 30px;
	top: 50%;
	left: 5px;
	margin-top: -15px;
	overflow: hidden;
	background: url(../images/iconos-formulario.png) no-repeat 0px 0px / auto 500%;
}

.wrpCampoConIcono .iconoCelda.email {
	background-position-y: 0%;
}

.wrpCampoConIcono .iconoCelda.password {
	background-position-y: 25%;
}

.wrpCampoConIcono .iconoCelda.busqueda {
	background-position-y: 50%;
}

.wrpCampoConIcono .iconoCelda.calendario {
	background-position-y: 75%;
}

.wrpCampoConIcono .iconoCelda.principal {
	background-position-y: 100%;
}

.wrpCampoConIcono.perfiles.valid .iconoCelda {
	background-position-x: 20%;
}

.wrpCampoConIcono.clientes.valid .iconoCelda {
	background-position-x: 40%;
}

.wrpCampoConIcono.valid.dataFullBlur .iconoCelda {
	background-position-x: 10%;
}

.wrpBtnAccion {
	border: 2px solid #0093d9;
	color: #0093d9;
	min-width: 180px;
	background-color: transparent;
	font-weight: bold;
	border-radius: 6px;
	font-size: 16px;
	margin: 0px 16px;
}

.wrpBtnAccion .icono {
	position: relative;
	display: inline-block;
	vertical-align: top;
	width: 20px;
	height: 20px;
	background: url(../images/iconos-botones-accion.png) no-repeat 0px 0px / 600% auto;
	margin-right: 8px;
	overflow: hidden;
}

.wrpBtnAccion.cancel,
.wrpBtnAccion.return {
	border-color: #e95128;
	color: #e95128;
}

.wrpBtnAccion.upload,
.wrpBtnAccion.next,
.wrpBtnAccion.prev,
.wrpBtnAccion.search {
	border-color: #7fc9ec;
	color: #7fc9ec;
}

.wrpBtnAccion.download {
	border-color: #8cbf43;
	color: #8cbf43;
}

.wrpBtnAccion.download .icono {
	background-position-x: 20%;
}

.wrpBtnAccion.upload .icono {
	background-position-x: 40%;
}

.wrpBtnAccion.prev .icono {
	background-position-x: 40%;
	transform: rotate(-90deg);
}

.wrpBtnAccion.next .icono {
	background-position-x: 40%;
	transform: rotate(90deg);
}

.wrpBtnAccion.cancel .icono {
	background-position-x: 60%;
}

.wrpBtnAccion.return .icono {
	background-position-x: 80%;
}

.wrpBtnAccion.search .icono {
	background-position-x: 100%;
}

.wrpBtnAccion:hover {
	background-color: #0093d9;
	color: #fff;
}

.wrpBtnAccion:hover .icono {
	background-position-y: 100%;
}

.wrpBtnAccion.cancel:hover,
.wrpBtnAccion.return:hover {
	background-color: #e95128;
}

.wrpBtnAccion.upload:hover,
.wrpBtnAccion.next:hover,
.wrpBtnAccion.prev:hover,
.wrpBtnAccion.search:hover {
	background-color: #7fc9ec;
}

.wrpBtnAccion.download:hover {
	background-color: #8cbf43;
}

.wrpIcoSolo {
	display: inline-block;
	position: relative;
	width: 25px;
	height: 35px;
	overflow: hidden;
	cursor: pointer;
}

.wrpIcoSolo.forgotPassword {
	background: url(../images/icono-password.png) no-repeat 0px 0px / 200% auto;
}

.wrpIcoSolo.forgotPassword:hover {
	background-position-x: 100%;
}

.wrpElemVisualLista .accion {
	position: relative;
	color: #0093d9;
	text-decoration: none;
	height: 30px;
	line-height: 35px;
}

.wrpElemVisualLista .accion .icono,
.wrpTituloAccion .icono {
	display: inline-block;
	vertical-align: top;
	position: relative;
	width: 30px;
	height: 30px;
	overflow: hidden;
}

.wrpTituloAccion .icono {
	margin-right: 5px;
}

.wrpElemVisualLista .accion .icono {
	background: url(../images/iconos-acciones.png) no-repeat 0px 0px / auto 100%;
}

.wrpElemVisualLista .accion.view .icono {
	background-position-x: 0%;
}

.wrpElemVisualLista .accion.edit .icono {
	background-position-x: 5%;
}

.wrpElemVisualLista .accion.delete .icono {
	background-position-x: 10%;
}

.wrpElemVisualLista .accion.new .icono {
	background-position-x: 15%;
}

.wrpElemVisualLista .accion.search .icono {
	background-position-x: 20%;
}

.wrpElemVisualLista .accion.copy .icono {
	background-position-x: 25%;
}

.wrpElemVisualLista .accion.notification .icono {
	background-position-x: 30%;
}

.wrpElemVisualLista .accion.historical .icono {
	background-position-x: 35%;
}

.wrpElemVisualLista .accion.viewClose .icono {
	background-position-x: 40%;
}

.wrpElemVisualLista .accion.upload .icono {
	background-position-x: 45%;
}

.wrpElemVisualLista .accion.download .icono {
	background-position-x: 50%;
}

.wrpElemVisualLista .accion.pdf .icono {
	background-position-x: 55%;
}

.wrpElemVisualLista .accion.xls .icono {
	background-position-x: 60%;
}

.wrpElemVisualLista .accion.xml .icono {
	background-position-x: 65%;
}

.wrpElemVisualLista .accion.imagen .icono {
	background-position-x: 70%;
}

.wrpElemVisualLista .accion.deleteInactive .icono {
	background-position-x: 75%;
}

.wrpElemVisualLista .accion.reportes .icono {
	background-position-x: 80%;
}

.wrpElemVisualLista .accion.email .icono {
	background-position-x: 85%;
}

.wrpElemVisualLista .accion.cxc .icono {
	background-position-x: 90%;
}

.wrpElemVisualLista .accion.cxp .icono {
	background-position-x: 90%;
}

.wrpElemVisualLista .accion.comentarios .icono {
	background-position-x: 95%;
}

.wrpElemVisualLista .accion.facturacion .icono {
	background-position-x: 100%;
}

.wrpElemVisualLista .accion.view:hover .icono {
	background: url(../images/icono-ver.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.edit:hover .icono {
	background: url(../images/icono-modificar.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.delete:hover .icono {
	background: url(../images/icono-borrar.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.new:hover .icono {
	background: url(../images/icono-nuevo.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.search:hover .icono {
	background: url(../images/icono-buscar.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.copy:hover .icono {
	background: url(../images/icono-duplicar.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.notification:hover .icono {
	background: url(../images/icono-notificacion.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.historical:hover .icono {
	background: url(../images/icono-historial.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.viewClose:hover .icono {
	background: url(../images/icono-visto.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.upload:hover .icono {
	background: url(../images/icono-upload.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.download:hover .icono {
	background: url(../images/icono-download.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.pdf:hover .icono {
	background: url(../images/icono-pdf.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.xls:hover .icono {
	background: url(../images/icono-xls.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.xml:hover .icono {
	background: url(../images/icono-xml.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.imagen:hover .icono {
	background: url(../images/icono-imagen.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.reportes:hover .icono {
	background: url(../images/icono-reportes.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.email:hover .icono {
	background: url(../images/icono-email.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.cxc:hover .icono {
	background: url(../images/icono-cxc.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.cxp:hover .icono {
	background: url(../images/icono-cxp.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.comentarios:hover .icono {
	background: url(../images/icono-comentarios.gif) no-repeat 0px 0px / 100% auto;
}

.wrpElemVisualLista .accion.facturacion:hover .icono {
	background: url(../images/icono-facturacion.gif) no-repeat 0px 0px / 100% auto;
}

.wrpInterfazTitulo {
	text-align: center;
	font-weight: bold;
	line-height: 80px;
	font-size: 26px;
	color: #b2b2b2;
}

.wrpInterfazTitulo .wrpInterfazIcono {
	display: inline-block;
	vertical-align: top;
	position: relative;
	width: 80px;
	height: 80px;
	margin-right: 10px;
	overflow: hidden;
}

.wrpInterfazTitulo.modulos .wrpInterfazIcono {
	background: url(../images/iconos-modulos-mini.png) no-repeat 100% 0px / 200% auto;
}

/*.wrpInterfazTitulo.moduloPerfiles .wrpInterfazIcono {
	background: url(../images/iconos-modulo-perfiles.png) no-repeat 100% 0px / 200% auto;
}*/

.wrpInterfazTitulo.moduloClientes .wrpInterfazIcono {
	background: url(../images/iconos-modulo-clientes.png) no-repeat 100% 0px / 200% auto;
}

.wrpInterfazTitulo.moduloPerfiles.usuarios .wrpInterfazIcono {
	background-position-y: 0%;
}

.wrpInterfazTitulo.moduloPerfiles.roles .wrpInterfazIcono {
	background-position-y: 14.28%;
}

.wrpInterfazTitulo.moduloPerfiles.sucursales .wrpInterfazIcono {
	background-position-y: 28.56%;
}

.wrpInterfazTitulo.moduloPerfiles.empresa .wrpInterfazIcono {
	background-position-y: 42.84%;
}

.wrpInterfazTitulo.moduloPerfiles.permisos .wrpInterfazIcono {
	background-position-y: 57.12%;
}

.wrpInterfazTitulo.moduloPerfiles.notificaciones .wrpInterfazIcono {
	background-position-y: 71.40%;
}

.wrpInterfazTitulo.moduloPerfiles.historialMovimientos .wrpInterfazIcono {
	background-position-y: 85.68%;
}

.wrpInterfazTitulo.moduloClientes.clientes .wrpInterfazIcono {
	background-position-y: 0%;
}

.wrpFiltros {
	width: 500px;
	margin: 0px auto;
}

.wrpVistaContenido {
	position: relative;
	width: 1260px;
	margin: 0px auto;
}

.wrpTituloAccion {
	line-height: 30px;
}

.wrpTituloAccion a {
	text-decoration: none;
}

.wrpTituloAccion .icono {
	background: url(../images/iconosBtn.png) no-repeat 0px 0px / 200% auto;
}

.wrpTituloAccion .icono.new {
	background-position-y: 50%;
}

.wrpTituloAccion a:hover {
	color: #fff;
}

.wrpTituloAccion a:hover .icono {
	background-position-x: 100%;
}

.wrpTituloAccion a:hover .icono.new {
	background: url(../images/icono-nuevo.gif) no-repeat 0px 0px / 100% auto;
}

.w3-table tr.w3-border-bottom {
	border-bottom-width: 2px !important;
}

.w3-striped tbody tr:nth-child(2n) {
	background-color: #323232;
}

.wrpCeldaCol {
	padding: 0px 16px;
}

.wrpCamposInhabilitados .txtColor,
.wrpCamposInhabilitados .w3-input,
.wrpCamposInhabilitados .w3-select,
.wrpCamposInhabilitados .w3-textarea,
.wrpCamposInhabilitados .w3-radio,
.wrpCamposInhabilitados .w3-check {
	opacity: 0.4;
}

.wrpPaginacion .w3-button {
	display: inline-block;
	margin: 0px;
	padding: 8px 10px;
	text-decoration: none;
	cursor: pointer;
	border-radius: 8px;
	font-weight: bold;
}

.wrpPaginacion .w3-button.active {
	color: #fff;
}

.wrpPaginacion .w3-button:hover {
	color: #fff;
	background-color: #323232;
}

.wrpIconoLabelAyuda {
	position: relative;
	display: inline-block;
	vertical-align: top;
	width: 20px;
	height: 20px;
	margin-left: 5px;
	background: url(../images/icono-ayuda2.png) no-repeat 0px 0px / 100% auto;
	opacity: 0.6;
}

.wrpIconoLabelAyuda span {
	display: none;
	position: absolute;
	top: 0%;
	left: 100%;
	width: 250px;
	padding: 10px;
	background-color: #fff;
	border: 2px solid #ccc;
	border-radius: 0px 10px 10px;
	font-size: 12px;
	color: #565655;
	z-index: 1;
	margin-left: 15px;
}

.wrpIconoLabelAyuda span::before,
.wrpIconoLabelAyuda span::after {
	content: "";
	position: absolute;
	border-style: solid;
	top: 0px;
	left: 0px;
	border-width: 8px;
}

.wrpIconoLabelAyuda span::before {
	border-color: #ccc #ccc transparent transparent;
	margin-top: -2px;
	margin-left: -17px;
}

.wrpIconoLabelAyuda span::after {
	border-color: #fff #fff transparent transparent;
	margin-left: -12px;
}

.wrpIconoLabelAyuda:hover {
	opacity: 1;
}

.wrpIconoLabelAyuda:hover span {
	display: block;
}

.wrpGroupBorder {
	border: 1px solid #ccc;
}

.wrpGroupBorderCaja {
	position: relative;
	border: 1px solid #ccc;
	border-radius: 8px;
}

.wrpGroupBorderCaja:hover {
	box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2),0px 6px 20px 0px rgba(0,0,0,0.19)!important;
}

/*******************************************************************************************************************************************
													configuracion de clases - template
*******************************************************************************************************************************************/

/*******************************************************************************************************************************************
												configuracion de las interfaces - template
*******************************************************************************************************************************************/

.template_cabecera {
	height: 70px;
	padding: 16px;
	z-index: 11 !important;
	background-color: #323232;
	box-shadow:0px 8px 8px 0px rgba(0,0,0,0.2),0px 4px 10px 0px rgba(0,0,0,0.19)!important;
}

.template_cabecera .template_logo img {
	height: 100%;
}

.btnPrincipalMovil {
	position: absolute;
	margin: -15px 0px 0px -15px;
	padding: 0px;
	width: 30px;
	height: 30px;
	top: 50%;
	left: 50%;
	cursor: pointer;
	background: url(../images/logo-movil.png) no-repeat 0px 0px / 100% auto;
	display: none;
}

.template_sideNav {
	position: fixed;
	width: 62px;
	top: 0px;
	left: 0px;
	height: 100%;
	padding: 16px;
	background-color: #323232;
	z-index: 12;
	overflow: hidden;
}

.template_sideNav.show {
	display: block;
	width: 250px;
}

.btnMenuMovil {
	display: inline-block;
	width: 30px;
	height: 30px;
	margin: 0px;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	cursor: pointer;
}

.btnMenuMovil span {
	display: block;
	position: absolute;
	height: 4px;
	width: 100%;
	background: #b2b2b2;
	border-radius: 9px;
	opacity: 1;
	left: 0;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .25s ease-in-out;
	-moz-transition: .25s ease-in-out;
	-o-transition: .25s ease-in-out;
	transition: .25s ease-in-out;
}

.btnMenuMovil span:nth-child(1),
.btnMenuMovil span:nth-child(2),
.btnMenuMovil span:nth-child(3) {
	-webkit-transform-origin: left center;
	-moz-transform-origin: left center;
	-o-transform-origin: left center;
	transform-origin: left center;
}

.btnMenuMovil span:nth-child(1) {
	top: 6px;
}

.btnMenuMovil span:nth-child(2) {
	top: 14px;
}

.btnMenuMovil span:nth-child(3) {
	top: 22px;
}

.btnMenuMovil.open span:nth-child(1) {
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 1px;
	left: 5px;
}

.btnMenuMovil.open span:nth-child(2) {
	width: 0%;
	opacity: 0;
}

.btnMenuMovil.open span:nth-child(3) {
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	transform: rotate(-45deg);
	top: 23px;
	left: 5px;
}

.template_cabecera .btnMenuMovil {
	display: none;
}

.wrpNombreRolSession {
	position: absolute;
	width: 172px;
	top: 16px;
	left: 62px;
}

.wrpNombreRolSession .wrpNombres {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	color: #b2b2b2;
}

.wrpNombreRolSession .iconosSistema {
	position: relative;
	height: 30px;
	line-height: 30px;
	color: #fff;
	font-weight: bold;
	text-indent: 30px;
	cursor: pointer;
}

.wrpNombreRolSession .iconosSistema::before {
	position: absolute;
	content: "";
	width: 24px;
	height: 24px;
	top: 3px;
	left: 0px;
	overflow: hidden;
	background: url(../images/iconosBtn.png) no-repeat 0px 0px / 200% auto;
}

.wrpNombreRolSession .iconosSistema.salir::before {
	background-position-y: 33.32%;
}

.wrpNombreRolSession .iconosSistema.salir:hover::before {
	background: url(../images/icono-salir.gif) no-repeat 0px 0px / 100% auto;
}

.wrpSeparadorSideNav {
	display: block;
	padding-bottom: 50px;
}

.wrpElemModuloIconoNombre {
	position: relative;
	height: 30px;
	line-height: 30px;
	font-weight: bold;
	color: #b2b2b2;
	text-indent: 46px;
	display: block;
	text-decoration: none;
}

.wrpElemModuloIconoNombre:hover {
	color: #fff;
}

.wrpElemModuloIconoNombre::before {
	position: absolute;
	content: "";
	width: 30px;
	height: 30px;
	top: 0px;
	left: 0px;
	overflow: hidden;
	background: url(../images/iconos-modulos-mini.png) no-repeat 0px 0px / 200% auto;
}

.wrpElemModuloIconoNombre.clientes::before {
	background-position-y: 100%;
}

.wrpElemModuloIconoNombre.clientes:hover::before {
	background-position-x: 100%;
}

.template_contenedorCuerpo {
	position: relative;
	z-index: 9;
	margin-top: 80px;
	margin-left: 62px;
	padding-bottom: 32px;
	transition: margin-top 1s ease-in-out 0s, margin-left .4s ease-in-out 0s;
}

.template_contenedorCuerpo.showSideNav {
	margin-left: 250px;
}

.txtColor.perfiles {
	color: #0094d9;
}

.txtColor.default {
	color: #b2b2b2;
}

.wrpElemVisualLista .accion .wrpInfoLeyenda {
	position: absolute;
	min-width: 150px;
	display: none;
	z-index: 1;
}

.wrpElemVisualLista .accion .wrpInfoLeyenda {
	line-height: normal;
	bottom: 100%;
	right: 50%;
	padding-bottom: 16px;
}

.wrpElemVisualLista .accion:hover .wrpInfoLeyenda {
	display: block;
}

.wrpElemVisualLista .accion .wrpInfoLeyenda::before {
	position: absolute;
	content: "";
	border-width: 10px;
	border-style: solid;
	border-color: #fff #fff transparent transparent;
	bottom: 2px;
	right: 0px;
}

.wrpElemVisualLista .accion .wrpInfoLeyenda p {
	font-size: 11px;
	color: #b2b2b2;
	font-weight: bold;
	color: #0093d9;
}

footer {
	position: absolute !important;
	padding: 20px 20px 80px !important;
}

.wrpContainerBobAnim {
	display: none;
}

.logoFactory {
	height: 70px;
}

.template_mascaraPrincipal {
	cursor: pointer;
	z-index: 9;
}

.template_mascaraPrincipal.nivel2 {
	z-index: 5;
}

.w3-modal.nivel2 {
	z-index: 6;
}

.w3-modal-content {
	border-radius: 6px;
	background-color: #323232;
}

.btnCerrarPopup {
	position: absolute;
	width: 20px;
	height: 20px;
	top: 0px;
	left: 0px;
	cursor: pointer;
	background: url(../images/btn-cerrar-popup.png) no-repeat 0px 0px / auto 100%;
	margin: 16px;
}

.btnCerrarPopup:hover {
	background-position-x: 100%;
}

/*******************************************************************************************************************************************
														configuracion de las interfaces - template
*******************************************************************************************************************************************/

/*******************************************************************************************************************************************
														configuracion de las interfaces - responsivo
*******************************************************************************************************************************************/

@media (max-width: 1320px) {
	.template_contenedorCuerpo .w3-container {
	    padding: 0px;
	}

	.w3-modal .w3-container {
		padding: 16px;
	}
}

@media (max-width: 1300px) {
	.wrpVistaContenido {
		width: 100%;
	}

	.wrpFiltros {
		width: 100% !important;
	}
}

@media (max-width: 1100px) {
	.wrpInterfazTitulo {
		line-height: 60px;
		font-size: 24px;
	}

	.wrpInterfazTitulo .wrpInterfazIcono {
		width: 60px;
		height: 60px;
		margin-right: 5px;
	}
}

@media (max-width: 1000px) {
	.w3-row > .wrpCeldaCol.l2,
	.w3-row > .wrpCeldaCol.l4,
	.w3-row > .wrpCeldaCol.l6,
	.w3-row > .wrpCeldaCol.l8,
	.w3-row > .wrpCeldaCol.l10 {
		padding: 8px;
	}
}

@media (max-width: 800px) {
	.wrpInterfazTitulo {
		line-height: 40px;
		font-size: 18px;
	}

	.wrpInterfazTitulo .wrpInterfazIcono {
		width: 40px;
		height: 40px;
	}

    .wrpBtnAccion {
		font-size: 14px;
		min-width: 160px;
	}

	.w3-modal {
		padding-top: 100px;
	}

	.wrpBotonesFinales .w3-section {
		margin: 0px !important;
	}

	.wrpBotonesFinales .wrpBtnAccion {
		margin: 8px;
	}
}

@media (max-width: 600px) {
	body {
		margin-bottom: 0px;
	}

	.w3-row > .wrpCeldaCol {
		padding: 8px;
	}

	.w3-row > .wrpCeldaCol:only-child {
		padding: 0px 8px;
	}

	.template_sideNav {
		display: block;
		width: 100%;
		height: auto;
		top: auto;
		bottom: -100%;
		z-index: 10;
	}

	.template_sideNav.show {
		width: 100%;
		bottom: 70px;
	}

	.wrpNombreRolSession {
		position: relative;
		width: 100%;
		top: 0px;
		left: 0px;
	}

	.wrpSeparadorSideNav {
		padding-bottom: 5px;
	}

	.template_cabecera {
		text-align: right !important;
	}

    .template_cabecera.w3-top {
		top: auto;
		bottom: 0px;
	}

	.template_sideNav .btnMenuMovil,
    .template_cabecera .template_logo,
	footer {
		display: none;
	}

	.template_cabecera .btnMenuMovil {
		display: block;
	}

    .btnPrincipalMovil {
		display: block;
	}

    .template_contenedorCuerpo {
		margin-top: 0px;
		margin-bottom: 50px;
	}

	.template_contenedorCuerpo,
	.template_contenedorCuerpo.showSideNav {
		margin-left: 0px;
	}

	.w3-modal {
		padding-top: 40px;
	}

	.w3-modal .w3-container {
		margin-bottom: 100px;
	}
}

/*******************************************************************************************************************************************
														configuracion de las interfaces - responsivo
*******************************************************************************************************************************************/