﻿/* ------------------------------------------------------------------------------------------------------------
 * --- APP STYLES 
 * --- Estilos generales y especificos de la aplicacion.
 * ------------------------------------------------------------------------------------------------------------
 */
* {
	margin: 			0;
}

/* estilo necesario para que el internet explorer no aparezca scroll */
html {
	overflow: 		auto;
}

html, body {	
	background: 	#fff;
	height: 		100%;
	padding: 		0;
}

/*	Cabecera	*/
#headerInaem{
	padding: 		0px 0px 16px 0px;
	display: 		block;
}

#headerInaem .top{
	background: 	#ffffff url('images/logos/bandaCabecera.png.xhtml') no-repeat left;
	height: 		80px;
	box-shadow: 	0 0px 40px rgba(0,0,0,0.2);
	position: 		relative;
	z-index: 		1;
	margin: 		0px 0px 30px 0px;
}

#headerInaem .top .content{
	float:			right;
	margin:			19px 75px 0 0;
}

#headerInaem .container{
    width: 			1170px;	
    margin-right: 	auto;
    margin-left: 	auto;
    padding-left: 	15px;
    padding-right: 	15px;
    background-color:   white;
    float:              left;
}

#headerInaem .container .logoContainer{
	width: 			28%;
	font-weight: 	500;
	line-height: 	23px;
	float:			left;
}

#headerInaem .container #leyenda{
	max-width: 		500px !important;
	display: 		inline-block;
	color: 			#505050;
	font-size: 		26px;
	font-weight: 	900;
	line-height: 	1.1em;
	overflow: 		hidden;
	vertical-align: baseline;
}

#headerInaem .menu{
	padding: 		0;
	float: 			right;
	padding-left: 	0 !important;
	width: 			100%;
	line-height: 	23px;
	margin-bottom: 	5px;
	margin-top: 	-10px;
}

/*	Contenido	*/
#content {
	min-height: 	64%;
	padding-bottom: 100px;
	clear:			both;
	background: 	#efefef;
}


#content .principal{
	width: 			95%;
	margin: 		10px auto;
}

#content .principal .boxMenuLateral {
	float:			left;
	/*min-height: 	200px;*/
	background: 	white;
	width: 			20%;
}

#content .principal .boxPrincipal {
	float:			right;
	background: 	white;
	width: 			75%;
	min-height: 	500px;
}

#content .migapan {
	font-size: 			130%;
	font-family:		'Raleway', Helvetica, Arial, Lucida, sans-serif;
	margin: 			10px auto;
	border-bottom: 		1px solid #b21847;
	width: 				95%;
	box-shadow: 		0px 1px 1px white;
	-ie-box-shadow: 	0px 1px 1px white;
	-moz-box-shadow: 	0px 1px 1px white;
	-webkit-box-shadow: 0px 1px 1px white;
	color: 				#000000; /*#1EA698;*/
	padding-bottom:		4px;
}

/*	Pie de página	*/
#footer {
	clear:		 		both;
	overflow: 			hidden;
	padding: 			15px 0 5px;
	margin-top:			25px;
	font-size: 			10px;
	color: 				#92A0A0;
	background-color: 	#999999;
	font-weight:		500;
	line-height: 		1.7em;
	font-family: 		'Open Sans', Helvetica, Arial, Lucida, sans-serif;
	position:			fixed;
	bottom:				0;
	left:				0;
	right:				0;
	z-index:			100;
}

#footer .container{
	position: 		relative;	
	text-align:		left;
	width:			80%;
	margin:			auto;
	padding: 		0;
	border: 		0;
	outline: 		0;
	background: 	transparent;
	font-size: 		100%;
	vertical-align: baseline;
}

#footer .container #logoPie{
	float: 			left;	
	margin: 		0;
	margin-top: 	13px;
	padding: 		0;
	border: 		0;
	outline: 		0;
	background: 	transparent;
	font-size: 		100%;
	vertical-align: baseline;
	text-align: 	left;
}

/*	Box	*/
.box {
	border: 				3px solid #b21847;
	background: 			white;
	border-radius: 			10px;
	-ie-border-radius: 		2px;
	-moz-border-radius: 	2px;
	-webkig-border-radius:	2px;
	padding: 				5px;
	/*box-shadow: 1px 1px 3px #EEEEEE;*/
	font-family:			'Open Sans', Helvetica, Arial, Lucida, sans-serif;
	line-height:			1.6em;
	font-size: 				14px;
}

.box .title {
	text-align: center;
	text-transform: 		uppercase;
	font-size: 				14px;
	color: 					#b21847;
	font-weight: 			bold;
	margin-bottom: 			10px;
}






/*	General	*/
.formInputValorGrande{
	display: block;
	width:90%;
	height: 24px;
	padding: 6px 12px;
	font-size: 14px;
	line-height: 1.428571429;
	color: #555;
	background-color: #fff;
	background-image: none;
	border: 1px solid #ccc;
	border-radius: 4px;
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
	-webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
	transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}


.formButtonGrande{
	background: #ff0044;
	border-radius: 4px;
	font-family: 'Maven Pro',sans-serif;
	font-size: 18px;
	padding: 10px 20px 10px 20px;
	text-decoration: none;
	text-transform: uppercase;
	color: #ffffff;
	border: none !important;
}

.formButtonGrande:hover{
	background: #b31846;
	color: #ffffff;
	text-decoration: none;
	cursor: pointer;
}

/* BOTON NORMAL  */
.button, ul.ayto_toolbar li input {
	border: 				none !important;
	border-radius: 			4px;
	color: 					#ffffff !important;
	padding: 				2px 10px;
	cursor: 				pointer;
	background: 			url('imagenes/btn_grad.png.xhtml') repeat-x #DDDDDD;
	font-size: 				100%;
	font-family:			'Open Sans', Helvetica, Arial, Lucida, sans-serif;
	text-decoration: 		none;
	background-image: 		linear-gradient(to bottom,#ff0044,#b31846);
	text-transform: uppercase;
}

.button:hover, ul.ayto_toolbar li input:hover {
	border: 				1px solid #21a2b4;
	border-radius: 			3px;
	-ie-border-radius: 		3px;
	-moz-border-radius: 	3px;
	-webkit-border-radius: 	3px;
	color: 					white !important;
	background: 			#b31846;
}

.button span{
	padding: 0px !important;
}

.button span:hover{
	color: 					white !important;
}

.ui-button-text{
	font-size: 				100%;
	font-family:			'Open Sans', Helvetica, Arial, Lucida, sans-serif;
	font-weight: 			normal;
	color: 					#ffffff !important;
}

.pmbutton .ui-button{
	background: 			url('imagenes/btn_grad.png.xhtml') repeat-x #0090BF !important;
	padding: 				2px 5px;
	background-image: 		linear-gradient(to bottom,#ff0044,#b31846);
}

.pmbutton .ui-button:hover{
	border: 				1px solid #21a2b4;
	border-radius: 			3px;
	-ie-border-radius: 		3px;
	-moz-border-radius: 	3px;
	-webkit-border-radius: 	3px;
	color: 					white !important;
	background: 			#b31846;
	
}

.pmbutton .ui-button-text{
	padding: 0 0 0 2.1em !important;
}

.check{
	margin-top:				1px;
    margin-left: 			2px;
    border: 				2px solid #ccc;
    padding-left:			4px;
	border-radius: 			5px;
	background-color: 		#fff;
	
	width:                      16px;
    height:                     16px;	
}

/*	ENLACES		*/

.enlaceNav {
	color: 					#b21847;
	font-weight: 			700;
	text-decoration: 		underline;
}

.enlaceNav:visited {
	color: 					#b21847;
	font-weight: 			700;
	text-decoration: 		underline;
}

.enlaceNav:hover {
	color: 					#91012e; /*black;*/
	text-shadow: 			0 0 2px white;
	-ie-text-shadow: 		0 0 2px white;
	-moz-text-shadow: 		0 0 2px white;
	-webkit-text-shadow: 	0 0 2px white;
	text-decoration: 		underline;
}

.enlaceNotNav{
	color: 					#b21847;
	/*font-weight: 			700;*/
}



/*	UPLOAD FILE		*/
.fileUpload {
	border: 1px solid #ccc;
	border-radius: 4px;
	background-color: #fff;
	margin-top: -15px;
}

.fileUpload, textarea {
	/*height: 24px;*/
	padding: 6px 6px;
	/*line-height: 1.428571429;*/
	color: #555;
	/*
	background-color: #fff;
	background-image: none;
	border: 1px solid #ccc;
	border-radius: 4px;
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
	-webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
	transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
	*/
	margin-top: 1px;
}


.fileUpload, input {
	cursor: 				pointer;
}

/*	UPLOAD FILE		*/
.fileUploadThin {
	border: 1px solid #ccc;
	border-radius: 4px;
	background-color: #fff;
	margin-top: -15px;
}

.fileUploadThin, textarea {
	/*height: 24px;*/
	/*padding: 6px 6px;*/
	/*line-height: 1.428571429;*/
	color: #555;
	/*
	background-color: #fff;
	background-image: none;
	border: 1px solid #ccc;
	border-radius: 4px;
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
	-webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
	transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
	*/
	margin-top: 1px;
}


.fileUploadThin, input {
	cursor: 				pointer;
}

/* --- Estilo general para las tablas ----- */

table.inaemTable{
	
}

table.inameTable tr{
	
}

table.inaemTable tr:hover{
	background-color: 	#CFEBEF;
}

table.inaemTable tr th, table.saludTable .header{
	text-align: 		left;
	padding:			5px;
	border-right:		2px solid white;
	color:				white;
	background-color:   #888888;
	font-size:			80%;
	line-height: 		normal;
}

table.inaemTable tr td{
	padding:			5px;
	font-size:			90%;
}

/* ------------------------------------------------------------------------------------------------------------ 
 * --- Estilo para las tablas primefaces----- */
 .primeSalud.ui-datatable table {

   /* width: 100%;*/
	table-layout: auto;
}
.primeSalud.ui-datatable thead th {
    padding:		5px;
    text-align: 	left;
/*    border-right:	2px solid white;*/
    color: 			white;
    background: 	#888888;
/*    line-height: 		normal;*/
    font-size:			80%;
}

.primeSalud.ui-datatable thead th{
    text-align: center;
    border-right: 2px solid white;
}


.primeSalud.ui-datatable tbody td,
.primeSalud.ui-datatable tfoot td,
.primeSalud.ui-datatable tfoot th{
    padding:      5px;
    overflow:     hidden;
    border-width: 1px;
    border-style: none;
    text-align:   left;
    font-size:	  80%;
    /*border-right: 2px solid white;*/
}

.primeSalud.ui-datatable-tablewrapper table { 
    overflow-x: auto;
    /*
    width: auto !important;
    height: 100% padding-bottom:    5px;
   */
}

.primeSalud.ui-datatable-scrollable-header-box{
margin-right: 15px!important;
}

.primeSalud.ui-datatable-scrollable-body {
overflow-y: scroll !important;
}

.primeSalud .ui-datatable-scrollable-header {
width: 100%;
}

.primeSalud .ui-state-default, .primeSalud .ui-widget-content .primeSalud .ui-state-default, .primeSalud .ui-widget-header .primeSalud .ui-state-default {
	/*
	border: none;
	*/
}

.primeSalud .ui-widget-content{
	
	border: none;
	/*
	color: white;
	*/
}

.primeSalud .ui-state-default, .primeSalud.ui-widget-content .ui-state-default, .primeSalud.ui-widget-header .ui-state-default{
    border: none;
    background: white;
    color: #222;
}
.primeSalud.ui-datatable .ui-column-filter{
    display: block;
    margin-top: 5px;
    width: 90%;
}

body .primeSalud.ui-datatable .primeSalud.ui-datatable-data > .primeSalud.tr.ui-datatable-even {
    background-color: 
    #f9f9f9;
}


/*
        ESTILO PARA EL PAGINADOR DE TABLAS PRIMEFACES
*/
.primeSalud .ui-paginator {
    margin:0px;
    text-align: center;
    padding:2px;
}

.primeSalud .ui-paginator.ui-paginator-top {
    border-bottom:0px none;
}

.primeSalud .ui-paginator.ui-paginator-bottom {
    border-top:1px solid #888888;
}

.primeSalud .ui-widget-header{
    border: 1px solid #888888;
    background: none;
    color: #888888;
}

.primeSalud .ui-state-default, .primeSalud .ui-widget-content .ui-state-default, .primeSalud .ui-widget-header .ui-state-default {
    border: 0px none;
    background: #fff;
    font-weight: bold;
    color:#888888;
}

.primeSalud .ui-state-active, .primeSalud .ui-widget-content .ui-state-active, .primeSalud .ui-widget-header .ui-state-active {
    border: none;
    background: #b21847 url("../javax.faces.resource/css/images/ui-bg_inset-hard_100_f5f8f9_1x100.png.xhtml") 50% 50% repeat-x;
    font-weight: bold;
    color: #fff;
}

.primeSalud .ui-state-default .ui-icon {
    background-image: url("../javax.faces.resource/css/images/ui-icons_6da8d5_256x240.png.xhtml");
}


.ui-paginator .ui-paginator-page,
.ui-paginator .ui-paginator-pages,
.ui-paginator .ui-paginator-next,
.ui-paginator .ui-paginator-last,
.ui-paginator .ui-paginator-first,
.ui-paginator .ui-paginator-prev,
.ui-paginator .ui-paginator-current {
	display: inline-block;
	padding: 2px 6px;
	zoom: 1;
	margin-left: 1px;
	margin-right: 1px;
	text-decoration: none;
	outline: none;
}

.ui-paginator .ui-paginator-page,
.ui-paginator .ui-paginator-next,
.ui-paginator .ui-paginator-last,
.ui-paginator .ui-paginator-first,
.ui-paginator .ui-paginator-prev{
    cursor: pointer;
}

.ui-paginator .ui-paginator-current,
.ui-paginator .ui-paginator-rpp-options {
	margin-left: 1em;
	margin-right: 1em;
    background-image: none;
}

.ui-paginator .ui-paginator-next .ui-icon,
.ui-paginator .ui-paginator-prev .ui-icon,
.ui-paginator .ui-paginator-first .ui-icon,
.ui-paginator .ui-paginator-last .ui-icon {
	height: auto;
	overflow: inherit;
}

.ui-paginator .ui-paginator-jtp-select option,
.ui-paginator .ui-paginator-rpp-options option {
    background-image: none;
    border:0 none;
    box-shadow:none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
}

/* Responsive */
@media (max-width: 35em) {
    .ui-paginator .ui-paginator-pages {
        display: none;
    }
}

/* ------------------------------------------------------------------------------------------------------------ 
 * --- Estilo consentimientos----- */
.decStyle{
	margin-left: 			2px;
	line-height: 			1.6em;
    background:				inherit;
    font-size:				110%;
}

/* ------------------------------------------------------------------------------------------------------------ 
 * --- Mostrar errores ----- */
 
.errors {
	overflow: 				hidden;
	width: 					90%;
	padding: 				5px 0;
	background: 			white;
	border: 				1px solid #A5ACAC;
	box-shadow: 			0 0 4px rgba(0, 0, 0, .3);
	-moz-box-shadow: 		0 0 4px rgba(0, 0, 0, .3);
	-webkit-box-shadow: 	0 0 4px rgba(0, 0, 0, .3);
	border-radius: 			2px;		
	-moz-border-radius: 	2px;
	-webkit-border-radius: 	2px;	
	font-size: 				14px;
	color:					#464B53;
	text-shadow: 			0 1px 0 #F1F4F4;
	-ie-text-shadow: 		0 1px 0 #F1F4F4;
	-moz-text-shadow: 		0 1px 0 #F1F4F4;
	-webkit-text-shadow: 	0 1px 0 #F1F4F4;
	margin: 				10px auto 20px auto;
}

.errorsModal {
	overflow: 				hidden;
	padding: 				5px 0;
	background: 			white;	
	font-size: 				14px;
	color:					#464B53;
	text-shadow: 			0 1px 0 #F1F4F4;
	-ie-text-shadow: 		0 1px 0 #F1F4F4;
	-moz-text-shadow: 		0 1px 0 #F1F4F4;
	-webkit-text-shadow: 	0 1px 0 #F1F4F4;
	margin: 				10px auto 10px auto;
}

.errors li, .errorsModal li {
	line-height: 		16px;
	margin: 			0 15px;
	padding: 			2px;
}

.errors li.error, .errorsModal li.error{
	background: 		url('images/icons/mes-error.png.xhtml') no-repeat rgba(255,255,255,0.5);
	padding-left: 		20px;
	color: 				#ff0000;
	display: 			block;
}

.errors li.info, .errorsModal li.info{
	background: 		url('images/icons/mes-info.png.xhtml') no-repeat rgba(255,255,255,0.5);
	padding-left: 		20px;
	color: 				#008000;
}

.errors li.warn, .errorsModal li.warn{
	background: 		url('images/icons/mes-warn.png.xhtml') no-repeat rgba(255,255,255,0.5);
	padding-left: 		20px;
	color:				#DCAB18;
	text-decoration:	none;
}

/* ------------------------------------------------------------------------------------------------------------ 
 * --- Estilo general para pestañas con UL/LI ----- */

.inaemTabs{
	border-bottom: 			1px solid #CCC;
	margin-bottom: 			10px;
	height: 				25px;
	padding: 				0 10px;
	box-shadow: 			0 1px 1px #EEE;
	-ms-box-shadow: 		0 1px 1px #EEE;
	-moz-box-shadow: 		0 1px 1px #EEE;
	-webkig-box-shadow: 	0 1px 1px #EEE;
}

.inaemTabs li{
	cursor: 				pointer;
	float: 					left;
	border: 				1px solid #CCC;
	background-color: 		#EEE;
	border-radius: 			2px 2px 0 0;
	-ms-border-radius: 		2px 2px 0 0;
	-moz-border-radius: 	2px 2px 0 0;
	-webkit-border-radius: 	2px 2px 0 0;
	height: 				24px;
	vertical-align: 		middle;
}

.inaemTabs li label{
	padding: 				5px 10px;
}

.inaemTabs li input, .inaemTabs li span, .inaemTabs li label, .inaemTabs li button{ 
	border:					none;
	background:				transparent;
	font-size:				90%;
	color:					inherit;
	cursor:					inherit;	
	display:				block;
	font-family:			'Open Sans', Helvetica, Arial, Lucida, sans-serif;
	-ms-box-shadow: 		none;
	-moz-box-shadow: 		none;
	-webkit-box-shadow: 	none;
	box-shadow: 			none;
}

.inaemTabs li input, .inaemTabs li button{
	padding: 				4px 10px;
}

.inaemTabs li span{
	padding: 				0 10px;
}

.inaemTabs li:hover{
	background-color: 		#CCC;
}

.inaemTabs li.selected{
	color: 					#b21847;
	border-bottom: 			1px solid white;
	background-color: 		white;
	box-shadow: 			0 1px 1px white;
    -ms-box-shadow: 		0 1px 1px white;
    -ie-box-shadow: 		0 1px 1px white;
    -moz-box-shadow: 		0 1px 1px white;
}

.inaemTabs li input[disabled=disabled]{
    color: #fff;
}

/* ------------------------------------------------------------------------------------------------------------ 
 * --- Estilo para la portada centros----- */
 
.portadaCentros {
 	display:	grid;
 	grid-gap: 10px;

    background-color: #fff;
    color: #444;
 }
.boxPortadaCentros{
    color: #b21847;
    border-radius: 5px;
    padding: 20px;
    font-size: 150%;
}
 
.titulo {
    grid-column: 1 / 4;
    grid-row: 1;
    text-align: center;
}
.cabCol1 {
    grid-column: 1 / 4;
    grid-row: 3;
    border-bottom: solid 1px #b21847;
    text-align: center;
}
.cabCol2 {
    grid-column: 1 / 4 ;
    grid-row: 5 ;
    border-bottom: solid 1px #b21847;
    text-align: center;
}
.cabCol3 {
    grid-column: 1 / 4;
    grid-row: 7;
    border-bottom: solid 1px #b21847;
    text-align: center;
}


.boxContPortadaCentros{
    color: #b21847;
    border: #dedede solid 2px;
    border-radius: 5px;
    padding: 20px;
    font-size: 150%;
}

.contTitulo {
    grid-column: 1 / 4;
    grid-row: 2;
    text-align: left;
    border: #dedede solid 2px;
    border-radius: 5px;
    padding: 10px;
}
.contCol1 {
    grid-column: 1 / 4 ;
    grid-row: 4;
}
.contCol2 {
    grid-column: 1/ 4 ;
    grid-row: 6;
}
.contCol3 {
    grid-column: 1 / 4;
    grid-row: 8;
}


/* ------------------------------------------------------------------------------------------------------------ 
 * --- Estilo los inputText de Primefaces ----- */
.primeInput {
    
    border: 1px solid #ccc !important;
    background: #fff !important;
    margin-top: 1px;
    margin-left: 2px;
    padding-left: 4px;
    border-radius: 5px;
    color: #666666 !important;
}
/* ------------------------------------------------------------------------------------------------------------ 
 * --- Estilo mayusculas para los textos ----- */
.upperCase{
    text-transform: uppercase;
}


/* ------------------------------------------------------------------------------------------------------------ 
 * --- Estilo colores tabla trabajadores ----- */
.ui-datatable .trattativa{
    background-color: #BCF5A9 !important;
}

.ui-datatable .ui-widget-content{
    background: none;
}


/* ------------------------------------------------------------------------------------------------------------ 
 * --- Estilo para modal con scroll lateral ----- */
.panelContent350scroll.ui-panel .ui-panel-content{
    overflow-y: auto;
    max-height: 350px;
}

/* ------------------------------------------------------------------------------------------------------------ 
 * --- Modificacion para mostrar los tooltip de primefaces encima de las modales ------ */
.ui-tooltip{
    z-index: 9000 !important;
}

.smallProfilePhoto {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    vertical-align: middle;
}

.contenedor-flexbox {
    display: flex; /*Convertimos al menú en flexbox*/
    justify-content: space-between; /*Con esto le indicamos que margine todos los items que se encuentra adentro hacia la derecha e izquierda*/
    align-items: center; /*con esto alineamos de manera vertical*/
}