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

@import url('https://fonts.googleapis.com/css?family=Roboto&display=swap');
html{
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
	/*overflow-x: hidden !important;*/

}
body{
	width: 100%;
	height: 100vh;
	overflow-x: hidden;
	position: absolute;
	margin: 0px auto;
}
h1,h2,h3,h4,p,ul,li,a,img,ol,label{
	margin: 0px;
	padding: 0px;
	text-decoration: none;
	font-weight: 100;
	list-style: none;
	font-family: "Roboto";
}
:root{

	  /* Variables manual de estilos gráficos */
	/*colores estandar*/
	 --azul_web: #6699cc;
 	 --azul_med: #6ba4b8;
	/* variante de azul */
	 --azul: #0871b8;
	 --azul_hover: #127cc3;
	 --azul_oscuro: #2E3191;
	 --azul_fondo: #F3F6FB;
	/* neutro */
	 --blanco: #FFFFFF;
	/*naranjas*/
	 --naranja_web: #eea730;
	 --naranja_med: #ff8f1c;
	 --naranja_ps: #edd0a661;
	/* negros */
	 --text: #2F2D2D;
	 --text_light: #999999;
	 --gris: #727272;
	 --gris_light: #e2e2e2;
	/* colores especiales */
	 --table_color: #e8e8e8;
	 --table_color_for: #e6f0f7;
	 --background-windows: #1c232dc9;
	 --shadow_text: rgba(124,124,124,0.10);
	 --shadow-windows: 2px 4px 6px 0px #302f509c; 


	/**/ /**/ /**/ /**/
	/* variables temporals */
	--azul_log: #3ca1b9;
	--naranja: #ff8f00;
	--text_color: #2f2d2d;
	--border-color: rgba(190,204,211,0.50);
	/*colores items*/
	--verde: #34AE72;
	--azul: #0871B8;
	--azul-hover: #127CC3;
	--viazul: #3DA0B9;
	/* nuevos himed web */
    /*colores*/
	--color_azul: #5c89b6;
	--color_azul_hover: #1480AF;
	/*variante de azul*/
	--color_azul_dark: #003D6F;
	--color_azul_claro: #0071BC;
	--color_azul_fondo: #f3f6fb;
	--color_azul_perla: #2E3191;
	--color_azul_himed: #6ba4b8;

	--color_verde: rgba(34,181,115);
	--color_verde_hover: rgba(45,196,124);
	--color_naranja: rgba(247,147,30);
	--color_naranja_hover: rgba(252,159,66);
	--color_rojo: rgba(193,39,45);
	--color_rojo_hover: rgba(193,39,45);
	--color_blanco: #FFFFFF;

	--color_text: #999999;
	--color_text_bold: #404040;

	--border-color: rgba(190,204,211,0.50);

	--table-gris: #e8e8e8;
	--table-text: #424242;
	--table-for-color: #e6f0f7;

	--background-windows: #1c232dc9;
	--shadow-windows: 2px 4px 6px 0px #302f509c;

	/*colores items*/
	--shadow_t1: rgba(124,124,124,0.10);

}
body{
	width: 100% !important;
	height: 100% !important;
	display: block;
	margin: 0px auto;
	position: relative !important;
	padding: 0px !important;
	 min-height: 100vh; 
	background-color: var(--blanco);
	box-shadow: var(--shadow-windows);
}
body > form{
	padding: 10px;
	font-size: 0px;
}
/* FRACCIONES CSS */
.fra-1{width: 100% !important;}
.fra-2{width: 50% !important;}
.fra-3{width: 33.333333333% !important;}
.fra-4{width: 25% !important;}
.fra-5{width: 20% !important;}
.fra-6{width: 16.666666667% !important;}
.fra-7{width: 14.285714286% !important;}
.fra-8{width: 12.5% !important;}
.fra-9{width: 11.111111111% !important;}

/* PORCENTAJES CSS */
.cien-1{width: 10% !important;}
.cien-2{width: 20% !important;}
.cien-3{width: 30% !important;}
.cien-4{width: 40% !important;}
.cien-5{width: 50% !important;}
.cien-6{width: 60% !important;}
.cien-7{width: 70% !important;}
.cien-8{width: 80% !important;}
.cien-9{width: 90% !important;}
.cien-100{width: 100% !important;}

/* Estandar de modal */
.wind-himed{
	display: block;
	font-size: 0px;
	position: relative;
	border-radius:  5px;
	box-sizing: border-box;
	padding: 40px 5px 5px 5px;
}
/* titulo del modal */
.wind-himed .title-wind{
	width: 100%;
	height: 35px;
	padding: 5px;
	position: absolute;
	top: 0px;
	left: 0px;
	display: block;
	box-sizing: border-box;
	background-color: var(--azul_web);
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
}
/* titulo del modal */
.wind-himed .title-wind h2{
	width: 100%;
	height: 100%;
	display: block;
	line-height: 1;
	text-align: center;
	font-size: x-large;
	color: var(--blanco);
}

/* fieldset estandar himed */
fieldset.forms, section.forms, div.forms, tr.forms{
	width: 100%;
	min-height: 100px;
	height: auto;
	display: inline-block;
	position: relative;
	vertical-align: top;
	padding: 35px 5px 5px 5px;
	box-sizing: border-box;
	border-radius: 5px;
	border: 1px solid var(--gris_light);
	background-color: var(--blanco);
	box-shadow: 0 0 4px 0px var(--shadow_text);
	margin: 0px 0px 5px 0px;
	font-size: 0px;
}
fieldset.forms legend,section.forms legend{
    width: 100%;
    height: 30px;
    padding: 5px;
    position: absolute;
    top: 0px;
    left: 0px;
    display: block;
    font-weight: 400;
    font-size: medium;
    text-align: center;
    font-family: "Roboto";
    box-sizing: border-box;
    color: var(--blanco);
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    background-color: var(--azul_web);
}

.img-fluid {
	max-width: 400px;
}

/* ESTANDAR DE FORMULARIOS */
div.box-input{
	width: 25%;
	padding: 5px;
	border-radius: 5px;
	position: relative;
	vertical-align: top;
	display: inline-table;
	box-sizing: border-box;
	margin-bottom: 5px;
	font-size: 0px;
}
div.box-input:hover{
	background-color: var(--table_color_for);
}
div.box-input label{
	width: 100%;
	display: block;
	margin-bottom: 5px;
}
div.box-input label{
	font-size: 15px !important;
	color: var(--text) !important;
}
/* label for* input select */
div.box-input label[for]{
	cursor: help;
}
div.box-input label[for]:active + input,div.box-input label[for]:active + select,div.box-input label[for]:active + textarea{
	background-color: var(--azul_fondo) !important;
	box-shadow: 0px 0px 3px 1px var(--azul_hover);
	cursor: help !important;
}
div.box-input input, div.box-input select, .input-estandar{
	width: 100% ;
	height: 35px !important;
	outline: none !important;
	display: inline-block !important;
	position: relative;
	vertical-align: top;
	color: var(--text) !important;
	padding: 5px 10px !important;
	border-radius: 3px !important;
	font-family: "Roboto" !important;
	box-sizing: border-box !important;
	border:1px solid var(--gris_light) ;
}
/* INPUT IMAGEN */
div.box-input input[type="image"],div.box-input input[type="image"]:hover,div.box-input input[type="image"]:focus,.input-image{
	width: 35px !important;
	height: 35px !important;
	border: none !important;
	padding: 0px !important;
	display: inline-block;
	position: relative;
	vertical-align: top;
	border-radius: 100% !important;
	transition: all 0.2s;
	cursor: pointer;
	box-sizing: border-box;
}
.input-image img{
	width: 100% !important;
	height: 100% !important;
	display: block;
	margin: 0px auto;
}
div.box-input input[type="image"]:hover,.input-image:hover{
	transform: rotate(30deg);
	padding: 2px !important;
	transition: all 0.2s;
}
div.box-input input[type="image"][disabled="disabled"],.input-image[disabled="disabled"],.input-image.disabled > img{
	filter: grayscale(9) !important;
	cursor: no-drop !important;
}
/* ESTILOS placeholder */
div.box-input input::placeholder, div.box-input select::placeholder{
	color: var(--text_light);
	font-weight: 100;
}
/* inpus disabled */
div.box-input input[disabled="disabled"], div.box-input select[disabled="disabled"], div.box-input textarea[disabled="disabled"], .input-estandar[disabled="disabled"]{
	background-color: var(--gris_light) !important;
	border-color: var(--text_light) !important;
	font-style: italic !important;
}
div.box-input input[disabled="disabled"]:hover, div.box-input select[disabled="disabled"]:hover, div.box-input textarea[disabled="disabled"]:hover,.input-estandar[disabled="disabled"]:hover{
	border-color: var(--text_light) !important;
	cursor: no-drop !important; 
}
/* estados del formulario */
div.box-input input:hover, div.box-input select:hover, div.box-input textarea:hover,.input-estandar:hover{border:1px solid var(--azul_med) !important;}
div.box-input input:focus, div.box-input select:focus, div.box-input textarea:focus,.input-estandar:focus{
	border:1px solid var(--azul_med) ;
	border-bottom: 3px solid var(--naranja_med) !important;
}
/* Elementos activos */
/*div.box-input select[multiple="multiple"]:focus,div.box-input textarea:focus{
	height: 100px !important;
	max-height: 100px;
	position: absolute !important;
	top: 28px !important;
	z-index: 1;
	resize: none !important;
}
div.box-input textarea:focus{
	max-height: 250px !important;
	resize: vertical !important;
}*/
/* ESTADOS & JAVASCRIPT */
div.box-input input:required:invalid, div.box-input select:required:invalid, div.box-input textarea:required:invalid,.input-invalid,.input-estandar:required:invalid{
	border:1px solid var(--naranja_med) !important;
	border-bottom: 3px solid var(--naranja_med) !important;	
}
div.box-input input:required:valid, div.box-input select:required:valid, div.box-input textarea:required:valid,.input-valid,.input-estandar:required:valid{
	border-bottom: 3px solid var(--azul_med) !important;	
}
/*Radio & Checked*/
div.box-input input[type="radio"],div.box-input input[type="checkbox"],.input_radio{
	display: none !important;
}
div.box-input input[type="radio"] + label,div.box-input input[type="checkbox"] + label,.input_radio + label{
	width: auto;
    height: auto;
    display: inline-table;
	position: relative;
	vertical-align: top;
}
div.box-input input[type="radio"] + label::before,div.box-input input[type="checkbox"] + label::before,.input_radio + label::before{
	content: "";
	width: 20px;
	height: 20px;
	display: inline-block;
	position: relative;
	vertical-align: top;
	border: 2px solid var(--gris);
	border-radius: 100%;
	padding: 7px;
	box-sizing: border-box;
	cursor: pointer;
}
div.box-input input[type="checkbox"] + label::before,.input_radio[type="checkbox"] + label::before{
	border-radius: 5px !important;
}
div.box-input input[type="radio"] + label::after,div.box-input input[type="checkbox"] + label::after,.input_radio + label::after{
	content: "";
    width: 10px;
    height: 10px;
    display: inline-block;
    position: absolute;
    left: 5px;
    top: 4.9px;
	border-radius: 100%;
	background-color: var(--gris);
	cursor: pointer;
}
div.box-input input[type="checkbox"] + label::after,.input_radio[type="checkbox"] + label::after{
	border-radius: 2px !important;
}
/*hover*/
div.box-input input[type="radio"] + label:hover::before,div.box-input input[type="checkbox"] + label:hover::before,.input_radio + label:hover::before{
	border: 2px solid var(--azul_med);
	padding: 4px;
}
div.box-input input[type="radio"] + label:hover::after,div.box-input input[type="checkbox"] + label:hover::after,.input_radio + label:hover::after{
	background-color: var(--azul_med);
}
/* checked */
div.box-input input[type="radio"]:checked + label::before,div.box-input input[type="checkbox"]:checked + label::before,.input_radio:checked + label::before{
	padding: 2 !important;
	border-color: var(--azul_med);
}
div.box-input input[type="radio"]:checked + label::after,div.box-input input[type="checkbox"]:checked + label::after,.input_radio:checked + label::after{
	background-color: var(--naranja_med);
}

/* disabled */
div.box-input input[type="radio"][disabled="disabled"] + label::before,div.box-input input[type="checkbox"][disabled="disabled"] + label::before,.input_radio[disabled="disabled"] + label::before{
	background-color: var(--gris_light) !important;
	cursor: no-drop !important;
}
/* disabled + hover */
div.box-input input[type="radio"][disabled="disabled"] + label:hover::before,div.box-input input[type="checkbox"][disabled="disabled"] + label:hover::before,.input_radio[disabled="disabled"] + label:hover::before{
	border: 2px solid var(--gris) !important;
}
div.box-input input[type="radio"][disabled="disabled"] + label:hover::after,div.box-input input[type="checkbox"][disabled="disabled"] + label:hover::after,.input_radio[disabled="disabled"] + label:hover::after{
	background-color: var(--gris) !important;
	cursor: no-drop !important;
}
div.box-input input[type="radio"][disabled="disabled"] + label span, div.box-input input[type="checkbox"][disabled="disabled"] + label span,.input_radio[disabled="disabled"] + label span{
	font-style: italic !important;
	color: var(--gris) !important;
	font-size: small !important;
}
/* span */
div.box-input input[type="radio"] + label span, div.box-input input[type="checkbox"] + label span,.input_radio + label span{
	position: relative;
	line-height: 1.5;
	margin: 0px 5px 0px;
	font-size: small !important;
}
/* buttons y submit */
div.box-input input[type="submit"],div.box-input button, .intp-buttom{
	width: auto !important;
	height: 35px !important;
	display: inline-table !important;
	padding: 5px 10px !important;
	font-weight: 600 !important;
	cursor: pointer;
	border-radius: 3px !important;
}
div.box-input input[type="submit"].btn-azul ,div.box-input button.btn-azul, .intp-buttom.btn-azul{
	background-color: var(--table_color_for) !important;
	border: 2px solid var(--azul_web) !important;
	color: var(--azul_web) !important;
}
div.box-input input[type="submit"].btn-azul:hover ,div.box-input button.btn-azul:hover,div.box-input input[type="submit"].btn-azul-bold ,div.box-input button.btn-azul-bold,.intp-buttom.btn-azul-bold,.intp-buttom.btn-azul:hover{
	background-color: var(--azul_web) !important;
	color: var(--blanco) !important;
	border: 2px solid var(--azul_web) !important;
}
div.box-input input[type="submit"].btn-azul-bold:hover ,div.box-input button.btn-azul-bold:hover,.intp-buttom.btn-azul-bold:hover{
	background-color: var(--azul_med) !important;
}
/* naranja */
div.box-input input[type="submit"].btn-naranja ,div.box-input button.btn-naranja, .intp-buttom.btn-naranja{
	background-color: var(--naranja_ps) !important;
	border: 2px solid var(--naranja_web) !important;
	color: var(--naranja_web) !important;
}
div.box-input input[type="submit"].btn-naranja:hover ,div.box-input button.btn-naranja:hover,div.box-input input[type="submit"].btn-naranja-bold ,div.box-input button.btn-naranja-bold,.intp-buttom.btn-naranja-bold,.intp-buttom.btn-naranja:hover{
	background-color: var(--naranja_web) !important;
	color: var(--blanco) !important;
	border: 2px solid var(--naranja_web) !important;
}
div.box-input input[type="submit"].btn-naranja-bold:hover ,div.box-input button.btn-naranja-bold:hover,.intp-buttom.btn-naranja-bold:hover{
	background-color: var(--naranja_med) !important;
	border-color: var(--naranja_med) !important;
}

/* tablas */
.table-content{
	width: 100%;
	display: block;
	margin: 0px auto;
	border-radius: 10px 10px 0px 0px;
	overflow: hidden;
}
.table-himed{
	width:100%;
	border-collapse:collapse;
	border-spacing:0;
}
.table-himed td{
	border-color:var(--gris_light);
	border-style:solid;
	border-width:1px;
	font-family: "Roboto";
	font-size:14px;
  	overflow:hidden;
  	padding:10px 5px;
  	word-break:normal;
  }
.table-himed thead th{
	border-color:var(--gris_light);
	border-style:solid;
	border-width:1px;
	border-bottom-width: 3px;
	font-family: "Roboto";
	font-size: medium;
	overflow:hidden;
	padding:10px 5px;
	word-break:normal;
	color: var(--text);
	font-weight: 600;
	background-color: var(--azul_web) !important
}
.table-himed tbody tr{
	background-color: var(--blanco);
	border-color:var(--gris_light);
	color: var(--text_light);
	text-align:left;
	vertical-align:top;
	font-family: "Roboto";

}
/* variantes de color x tabla*/
.table-himed[class*="for-table"] tbody tr:nth-child(2n+1),
.table-himed[class*="for-table"] tbody tr:nth-child(2n){
	color: var(--text) !important;
}
.table-himed.for-table-gris tbody tr:nth-child(2n+1){
	background-color: var(--gris_light) !important;
}
.table-himed.for-table-azul tbody tr:nth-child(2n+1){
	background-color: var(--table_color_for) !important;
}
.table-himed.for-table-naranja tbody tr:nth-child(2n+1){
	background-color: var(--naranja_ps) !important;
}
/* variante de color x columna */
.table-himed[class*="for-colum"] tbody td:nth-child(2n+1){
	color: var(--text) !important;
	font-weight: 600;	
}
.table-himed.for-colum-gris tbody td:nth-child(2n+1){
	background-color: var(--gris_light) !important;
}
.table-himed.for-colum-azul tbody td:nth-child(2n+1){
	background-color: var(--table_color_for) !important;
}
.table-himed.for-colum-naranja tbody td:nth-child(2n+1){
	background-color: var(--naranja_ps) !important;
}

@media screen and (max-width: 767px) {.table-himed {width: auto !important;}.table-himed col {width: auto !important;}.table-content {overflow-x: auto;-webkit-overflow-scrolling: touch;}}


.menu_opcion_estadisticas{
	width: auto;
	height: auto !important;
	display: table;
}
.menu_opcion_estadisticas ul{
	width: 100%;
	height:auto;
	display: block;
	font-size: 0px;
	padding: 5px 5px 0px 5px;
}
.menu_opcion_estadisticas ul li{
	width: auto;
	height: auto;
	cursor: pointer;
	padding: 5px 10px;
	display: inline-table;
	position: relative;
	vertical-align: top;
	font-weight: 100;
	font-size: medium;
	box-sizing: border-box;
	color: var(--color_azul);
	text-align: center;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	border: 1px solid var(--border-color);
	border-bottom: 0px;
}
.menu_opcion_estadisticas ul li a{
	color: var(--color_azul);
}
.menu_opcion_estadisticas ul li:hover,.menu_opcion_estadisticas ul li.active{
	font-weight: 600;
	background-color: var(--table-for-color);
}
.menu_opcion_estadisticas ul li:hover,.menu_opcion_estadisticas ul li.active a{
	font-weight: 600;
	background-color: var(--table-for-color);
}

.paginacion ul{
	list-style: none;
}

.paginacion ul li{
	list-style: none;
	display: inline-block;
	padding: 1px;
}


/*************************************************** Inicio responsive por col ( columnas) *********************************************/
.row {
	width: 100% !important;
	margin-bottom: 5px;
}

.row .col-1 {
	float: left;
	width: 8.3333%;
}

.row .col-2 {
	float: left;
	width: 16.6667%
}

.row .col-3 {
	float: left;
	width: 25%
}

.row .col-4 {
	float: left;
	width: 33.3333%;
}

.row .col-5 {
	float: left;
	width: 41.6667%;
}

.row .col-6 {
	float: left;
	width: 50%;
}

.row .col-7 {
	float: left;
	width: 58.3333%;
}

.row .col-8 {
	float: left;
	width: 66.6667%;
}

.row .col-9 {
	float: left;
	width: 75%
}

.row .col-10 {
	float: left;
	width: 83.3333%;
}

.row .col-11 {
	float: left;
	width: 91.6667%;
}

.row .col-12 {
	float: left;
	width: 100%;
}

/* fin campos de consulta */

/* Small */
@media screen and (min-width: 520px) and (max-width: 720px) {
	.row .col-sm-1 {
		float: left;
		width: 8.3333%;
	}

	.row .col-sm-2 {
		float: left;
		width: 16.6667%
	}

	.row .col-sm-3 {
		float: left;
		width: 25%
	}

	.row .col-sm-4 {
		float: left;
		width: 33.3333%;
	}

	.row .col-sm-5 {
		float: left;
		width: 41.6667%;
	}

	.row .col-sm-6 {
		float: left;
		width: 50%;
	}

	.row .col-sm-7 {
		float: left;
		width: 58.3333%;
	}

	.row .col-sm-8 {
		float: left;
		width: 66.6667%;
	}

	.row .col-sm-9 {
		float: left;
		width: 75%
	}

	.row .col-sm-10 {
		float: left;
		width: 83.3333%;
	}

	.row .col-sm-11 {
		float: left;
		width: 91.6667%;
	}

	.row .col-sm-12 {
		float: left;
		width: 100%;
	}
}

/* Medium */
@media screen and (min-width: 720px) and (max-width: 901px) {
	.row .col-md-1 {
		float: left;
		width: 8.3333%;
	}

	.row .col-md-2 {
		float: left;
		width: 16.6667%
	}

	.row .col-md-3 {
		float: left;
		width: 25%
	}

	.row .col-md-4 {
		float: left;
		width: 33.3333%;
	}

	.row .col-md-5 {
		float: left;
		width: 41.6667%;
	}

	.row .col-md-6 {
		float: left;
		width: 50%;
	}

	.row .col-md-7 {
		float: left;
		width: 58.3333%;
	}

	.row .col-md-8 {
		float: left;
		width: 66.6667%;
	}

	.row .col-md-9 {
		float: left;
		width: 75%
	}

	.row .col-md-10 {
		float: left;
		width: 83.3333%;
	}

	.row .col-md-11 {
		float: left;
		width: 91.6667%;
	}

	.row .col-md-12 {
		float: left;
		width: 100%;
	}
}

/* Large */
@media screen and (min-width: 901px) and (max-width: 1200px) {
	.row .col-lg-1 {
		float: left;
		width: 8.3333%;
	}

	.row .col-lg-2 {
		float: left;
		width: 16.6667%
	}

	.row .col-lg-3 {
		float: left;
		width: 25%
	}

	.row .col-lg-4 {
		float: left;
		width: 33.3333%;
	}

	.row .col-lg-5 {
		float: left;
		width: 41.6667%;
	}

	.row .col-lg-6 {
		float: left;
		width: 50%;
	}

	.row .col-lg-7 {
		float: left;
		width: 58.3333%;
	}

	.row .col-lg-8 {
		float: left;
		width: 66.6667%;
	}

	.row .col-lg-9 {
		float: left;
		width: 75%
	}

	.row .col-lg-10 {
		float: left;
		width: 83.3333%;
	}

	.row .col-lg-11 {
		float: left;
		width: 91.6667%;
	}

	.row .col-lg-12 {
		float: left;
		width: 100%;
	}
}

/* Large */
@media screen and (min-width: 1200px) {
	.row .col-xl-1 {
		float: left;
		width: 8.3333%;
	}

	.row .col-xl-2 {
		float: left;
		width: 16.6667%
	}

	.row .col-xl-3 {
		float: left;
		width: 25%
	}

	.row .col-xl-4 {
		float: left;
		width: 33.3333%;
	}

	.row .col-xl-5 {
		float: left;
		width: 41.6667%;
	}

	.row .col-xl-6 {
		float: left;
		width: 50%;
	}

	.row .col-xl-7 {
		float: left;
		width: 58.3333%;
	}

	.row .col-xl-8 {
		float: left;
		width: 66.6667%;
	}

	.row .col-xl-9 {
		float: left;
		width: 75%
	}

	.row .col-xl-10 {
		float: left;
		width: 83.3333%;
	}

	.row .col-xl-11 {
		float: left;
		width: 91.6667%;
	}

	.row .col-xl-12 {
		float: left;
		width: 100%;
		padding: 0 5px 0 0;
	}
}

/*************************************************** Fin responsive por col ( columnas) *********************************************/



.dataTables_length label {
	display: flex!important;
    align-items: center!important;
    gap: 3px;
}

/* .table-himed[class*="for-table"] tbody tr:nth-child(2n+1) {
    color: var(--text) !important;
    font-weight: none;
} */



.historico-tabla {
    background-color: #6699cc!important;
    color: #FFFF!important;
}