
/*Small devices (landscape phones, 576px and up)*/

.content {
    position: relative;
    min-height: 420px;
    height: auto !important;
    width: 80%;
    margin-left: 5%;
}

.box {
    border: 1px solid #dcdcdc;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    margin-top: 3px;
    background-color: #F9F9F9;
    min-height: 100px;
    height: auto !important;
    padding: 4px;
}

.encabezadoAzul {
	width: 100%;
	height: 38px;
	background-color: #323232;
	font-size: 16px;
	font-weight: bold;
	line-height: 30px;
	padding-left: 10px;
	color: #FFF;
	text-shadow: 1px 1px 1px #000000;
	text-align: center;
    filter: dropshadow(color=#000000, offx=1, offy=1);
    /*border-top: 3px solid #F07D41;
    border-bottom: 2px solid #F07D41;*/
}

.navbar, .textoEncabezado{
	background-color: #FAAA41;
	color: #fff;
	font-weight: bold;
}


.textoEncabezado {
	height: auto!important;
}

#nombreFiltro {
	margin: 0px!important;
}


#centrosCostoContenedorPrincipal .card-body {
    padding: 0px;
}

#centrosCosto .card {
    background-color: rgb(25,3,4,0.5);
}

.contenedorBotonesFuncionalidades {
	right: 0px;
    position: absolute
}

.list-group-item.active {
	z-index: 0!important;
}

.form-control.is-invalid {
	background-image: none!important;
}

.form-check {
	padding-left: 0px!important;
}

.noVacio {
	font: 20px;
	font-weight: bold;
	color: red;
}

.noVacio-sm {
	font-size: 12px;
}

.listaLetra {
	font-size: 1rem;
}

.botones {
    position: fixed;
    text-align: center;
    width: 90px;
    padding-left: 10px;
    top: 23%;
    left: 87%;
    z-index: 1;
}

.botonAccionLateral {
    display: block;
    background-color: #f7f7f7;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f7f7f7), to(#e7e7e7));
    background-image: -webkit-linear-gradient(top, #f7f7f7, #e7e7e7);
    background-image: -moz-linear-gradient(top, #f7f7f7, #e7e7e7);
    background-image: -ms-linear-gradient(top, #f7f7f7, #e7e7e7);
    background-image: -o-linear-gradient(top, #f7f7f7, #e7e7e7);
    color: #a7a7a7;
    margin: 20px;
    width: 52px;
    height: 52px;
    position: relative;
    text-align: center;
    line-height: 52px;
    border-radius: 50%;
    box-shadow: 0px 3px 8px #aaa, inset 0px 2px 3px #fff;
    cursor: pointer;

}

.tablaPermisos th, .tablaPermisos td {
	border: 1px solid #dee2e6;
}

.encabezadoAzulFuerte {
	background-color: #F4983E;
	color: #FFF;
	font-size: 15px;
}

.encabezadoAzulClaro {
	background-color: #FAEBD7;
	color: #000;
	font-size: 15px;
}

.arribah4{
	background-color: #F4F1EC;
	color: #FFF;
	font-size: 15px;
}

.medioh4{
	background-color: #ff942a;
	color: #FFF;
	font-size: 15px;
}

.abajoh4{
	background-color: #ff942a;
	color: #FFF;
	font-size: 15px;
}

.encabezadoAzulClaroDesvanecimineto {
	background-color: #FAEBD7;
}

.alert-info{
	background-color: #FAEBD7;
	color: #000;
	border-color: #FAEBD7;
}

.modal-header{
	background-color: #323232;
	color: #fff;
}

/*.textareaDescripcionGrupoPersonal, .descripcionGrupoPersonal {
	min-height: 111px!important;
	max-height: 111px!important;
	resize: none;
}*/

.descripcionGrupoPersonal {
	transition: all 1s ease;
}

.descripcionGrupoPersonal input,
.descripcionGrupoPersonal button,
.contenedorModalDescripcionesGruposPersonal input,
.contenedorModalDescripcionesGruposPersonal button {
	border-radius: 0px;
}

.bordeInferiorSeccionesFormularioEmpleados {
    border-bottom: 1px solid rgb(85 119 148)!important;
}

@media screen and (max-width: 740px) {

	.btnAgregar {
		width: 100%;
	}

}

@media (min-width: 320px) {

	.content {
		position: absolute;
		top: 200px;
	}

	.contenedorPrincipal{
		width:100%;
	}

	#tabsCatalogos li {
		width: 100%;
	}

	header {
		position:fixed;
		height: 100px;
		width: 100%;
		color: #FFF;
		border-top:3px solid #FAAA41;
		background: url(../img/bg_encabezado.jpg) no-repeat center center;
    	z-index:2;
		font-size:12px;
	    filter: dropshadow(color=#FAAA41, offx=1, offy=1);
		-webkit-box-shadow:  0px 1px 2px 2px #FAAA41;
	    box-shadow:  0px 1px 2px 2px #FAAA41;
	}

	header {
		padding-top: 3px;
	}

	header div{
		padding-left: 10px !important;
		padding-right: 10px !important;
	}

	#contenedorInfoEmpleado{
		padding-right: 0!important;
	}

	#contenedorInfoEmpleado div{
		padding-left: 0px;
	}

	.contenedorIconoHeader{
		padding: 0px!important;
	}

	.logo{
		padding-left: 5px;
	}

	#fotografiaEmpleado {
		border-radius: 150px;
		-webkit-border-radius: 150px;
		-moz-border-radius: 150px;
		width: 38px;
		height: 38px;
	}

	.contenedorBotonMenuPrincipal {
		z-index: 100;
	}

	.botonMenuPrincipal {
		display: block;
		background-color: #FFF;
		background-image: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#F7F7F7));
		background-image: -webkit-linear-gradient(top, #FFF, #F7F7F7);
		background-image: -moz-linear-gradient(top, #FFF, #F7F7F7);
		background-image: -ms-linear-gradient(top, #FFF, #F7F7F7);
		background-image: -o-linear-gradient(top, #FFF, #F7F7F7);
		color: #a7a7a7;
		margin: 20px;
		width: 100px;
		height: 100px;
		position: relative;
		text-align: center;
		line-height: 100px;
		border-radius: 50%;
		box-shadow: 0px 3px 8px #aaa, inset 0px 2px 3px #fff;
		cursor:pointer;
	}

	.botonMenuPrincipal:hover{
		background: #f5f5f5;
	}

	.botonMenuPrincipal:before{
		content: "";
		display: block;
		background: #fff;
		border-top: 2px solid #ddd;
		position: absolute;
		top: -12px;
		left: -12px;
		bottom: -12px;
		right: -12px;
		z-index: -1;
		border-radius: 50%;
		box-shadow: inset 0px 8px 48px #ddd;
	}

	.menuInicio {
		margin:auto;
		margin-top:190px;
		width: 100%;
		position: absolute;
		display: flex;
		justify-content: center;
	}

	.botonMenuPrincipal  {
    	margin: 20px auto;
	}

}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {

}

/*Large devices (desktops, 992px and up)*/

@media (min-width: 992px) {
	#tabsCatalogos li {
		width: auto;
	}
}

/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
	header {
		height: 135px;
		font-size: 14px;
	}

	header div{
		padding-left: 15px !important;
		padding-right: 15px !important;
	}

	#contenedorInfoEmpleado{
		padding-right: 15px!important;
	}

	#contenedorInfoEmpleado div{
		padding-left: 15px;
	}

	.contenedorIconoHeader{
		padding: 15px!important;
	}

	#fotografiaEmpleado {
		width: 60px;
		height: 60px;
	}

	.modal-lg {
		width: 1150px;
		max-width: 1150px;
	}
}

/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1600px) {
	header {
		font-size: 16px;
	}
}

/*----------ESTILOS NUEVOS----------*/

/* Scroll */

.scrollY {
	max-height: 200px;
    overflow-y: auto;
}

.scrollYh-3 {
	max-height: 300px!important;
}

.scrollYh-4 {
	max-height: 400px!important;
}

.scrollYh-6 {
	max-height: 600px!important;
}

.dataTable .group {
	background: #2f96b4!important;
    color: #FFF;
}

select[name="filtroAlimento"] {
	margin-left: 10px;

} select[name="filtroDieta"] {
	margin-left: 4px;
}

/*FONT SIZE*/

.t14px {
	font-size: 14px!important;
}

.centrarContenidoCelda {
	display: flex;
    justify-content: center;
    align-items: center;
    height: 38px;
}

.tbBorder {
	border: none!important;
}

.azulM {
	background: #0098ff!important;
}

.sinSombra {
	box-shadow: none!important;
	text-shadow: none!important;
}

.vertical-align-center {
	vertical-align: middle!important;
}

.border-right-1 {
	border-right: 1px solid!important;
}

/*.text-center {
	text-align: center!important;
}*/

.margin-auto {
	margin: 0px auto!important;
}

.outline-n {
	outline: none!important;
}

.click-b:placeholder {
	background-color: red;
}

/*Estilos catalogo compras*/
.contenedorFormularioCompras table td {
	border: none;
	margin-bottom: 1px;
}

/**
* Dimensiones
*/
.wd-30 {
	width: 30px!important;
}

.wd-40 {
	width: 40px!important;
}

.wd-50 {
	width: 50px!important;
}

.wd-60 {
	width: 60px!important;
}

.wd-70 {
	width: 70px!important;
}

.wd-80 {
	width: 80px!important;
}

.wd-90 {
	width: 90px!important;
}

.wd-100 {
	width: 100px!important;
}

.wd-150 {
	width: 150px!important;
}

.m-w-100 {
	min-width: 100px!important;
}

.m-w-120 {
	min-width: 120px!important;
}

.m-w-130 {
	min-width: 130px!important;
}

.m-w-140 {
	min-width: 140px!important;
}

.m-w-150 {
	min-width: 150px!important;
}

.m-w-160 {
	min-width: 160px!important;
}

.m-w-170 {
	min-width: 170px!important;
}

.m-w-180 {
	min-width: 180px!important;
}

/*Margins*/
.m-l-29 {
	margin-left: 29px!important;
}

.m-l-43 {
	margin-left: 43px!important;
}

.m-l-54 {
	margin-left: 54px!important;
}

.w-rem-5 {
	width: 5rem!important;
}

.w-rem-10 {
	width: 10rem!important;
}

.w-rem-15 {
	width: 15rem!important;
}

.w-rem-20 {
	width: 20rem!important;
}

.w-rem-30 {
	width: 30rem!important;
}

.w-rem-40 {
	width: 40rem!important;
}

.w-rem-50 {
	width: 50rem!important;
}

.w-rem-60 {
	width: 60rem!important;
}

.w-rem-70 {
	width: 70rem!important;
}

.w-rem-80 {
	width: 80rem!important;
}

.w-rem-90 {
	width: 90rem!important;
}

.w-rem-100 {
	width: 100rem!important;
}

.border-n {
	border: 0!important;
}

.botonRedondoPosicionAbs {
	position: absolute;
    left: 0;
    bottom: 191px;
    border-radius: 100%;
}

.margenBotonRedondoAgregarTarjeta {
	bottom: 150px;
}

.m-b-4p {
  margin-bottom: 4px!important;
}

/*.tooltip {
    top: 1px!important;
    z-index: 1;
}

.tooltip .tooltip-inner {
	min-width: 1400px;
    padding: 10px;
}*/

.contenedorPrincipal header {
	position: absolute;
	top: 0;
}

/*white-space*/
.w-sp {
	white-space: normal!important;
}


/*PAra los archivos*/
.renglonArchivo{
	height: 24px;
	padding: 2px;
	padding-left: 10px;
	border: solid 1px #CCC;
	text-align: left;
	clear: both;
	margin-left: 2px;
	-webkit-border-radius: 32px 0 0 32px;
	border-radius: 32px 0 0 32px;
	font-size: 12px;
	line-height: 24px;
}

.linkAbrirArchivo{
	height: 24px;
	width: 80%;
	padding-left: 5px;
	cursor: pointer;
	float: left;
}

.contenedorCargarDocumento, .contenedorActualizarArchivo{
	overflow: hidden;
	position: relative;
    border-color: #CCC;
    color: #666;
	border-radius: 4px;
    cursor: pointer;
    display: inline-block;
	padding: 6px 12px;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
}

.contenedorActualizarArchivo{
	background-color: #085E98;
	margin-right: 2px;
	width: 24px;
	height: 21px;
	-webkit-border-radius: 24px;
	border-radius: 20px;
	text-align: center;
	color: #FFF;
	cursor: pointer;
	font-size: 14px;
	padding: 0;
	padding-top: 2px;
	text-shadow: none;
}

.contenedorCargarDocumento input, .contenedorActualizarArchivo input{
	direction: ltr;
	font-size: 120px;
	position: absolute;
	right: 0;
	top: 0;
	cursor: pointer;
}

#botonSeleccionarArchivo, .botonActualizarArchivo{
	height: 40px;
}

.progresoDeCarga{
	width:300px;
	height:11px;
	margin: auto;
	text-align: center;
}

.barraProgreso{
	background:url(../img/progressbar.gif) repeat-x;
	height:11px;
}

#listaPermisosArchivo, #listaPermisosCategoria, #listaEditarPermisosCategoria, #listaEditarPermisosArchivos{
	width: 100%;
	height: 380px;
	overflow: scroll;
}

.barraScrollEstilizada::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
}

.barraScrollEstilizada::-webkit-scrollbar
{
	width: 7px;
	height: 7px;
	background-color: #F5F5F5;
}

.barraScrollEstilizada::-webkit-scrollbar-thumb
{
	background-color: #0ae;
	background-image: -webkit-gradient(linear, 0 0, 0 100%,
	                   color-stop(.5, rgba(255, 255, 255, .2)),
					   color-stop(.5, transparent), to(transparent));
}

.progresoDeCarga{
	width:200px;
	height:11px;
	margin: auto;
	text-align: center;
}

.barraProgreso{
	background:url(../img/progressbar.gif) repeat-x;
	height:11px;
}

.form-control-personal{
	/* display: block; */
	/* width: 100%; */
	height: calc(1.5em + .75rem + 2px);
	padding: 3px;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	color: #495057;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	border-radius: .25rem;
	transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}