/* Wrapper */
#wrapper{
    margin: auto;    
}
/* encabezado */
header {
    width: 100%;	
    margin: 0px auto 0px auto;
    padding: 0px 0px 0px 0px;	
}

#logo{
    cursor: pointer;    
    display: inline-block;
    margin: 10px 0px 10px 0px;
}

#navbar-right{
    display: inline-block;
    vertical-align: top;
    margin-top: 10px;
}

#navbar-right span{
    float: right;
    font-family: verdana;
    font-size: 12px;
    color: gray;    
    margin-right: 6px;
}

#navbar-right span a{
    text-decoration: none;
    font-weight: bold;
    color: #107927;
}

#navbar-right span a:hover{
    text-decoration: underline;
}

nav {
    width: 100%;    
    margin: 0px auto;
}

#cpa_recuadro_sup { 
    clear: both;
    width: 100%;
    height: 30px;
    margin: 0px auto 0px auto;
    background-color: #107927;
}

#cpa_espera {
    background: url('../imagenes/loadinfo.gif') no-repeat center center;
}

#cpa_inicio_inst{
    font-weight:normal;
    font-size:12pt;
    font-family:Verdana;
    text-align:justify;
    width:90%;/* Con respecto al div del tab  */	
}

#cpa_video_inst{
    font-weight:normal;
    width:100%;/* Con respecto al div del tab  */
    height:auto;
}
/*Contenedor generico*/
#contenedor {
    height: 100%;
    width: 100%;	        
    margin: 0px auto 0px auto;
    padding: 10px 0px 10px 0px;    
}
/*Se coloca la capa de formularios a la derecha*/
#cpa_contenido_form{    
    float:right;    
}

#ul_pnl_btns 
{ 
    list-style:none; 
}

.btn-menu
{
    cursor: pointer;
    padding: 6px 12px;
    border: 1px solid grey;
    border-radius: 4px;
    width: 60%;    
    background-color: #ddd;  
    margin-top: 8px;    
}

.btn-menu:hover
{
    background-color: #aaa;
}

.btn-menu a
{
    text-decoration: none;
    color: #107927;
    font-family: verdana;
    font-size: 12px;
    font-weight: bold;
}

/* Estilos usados para los botones usados para el acceso */

aside{/*Link donde se cargan los botones*/
    float:left;        
    padding: 10px 0px 0px 0px;
}	

/* Se genera el estilo usado para todos los formularios los cuales tienen el id de operacion */
#operacion{
    border: hidden;
    font-family: verdana;    	
}
#operacion table{
    border: hidden;
    width:100%;
}
#operacion thead th{        
    background-color: #ddd;
    text-align:center;
    color: #107927;	
    font-size:14px;        
    padding: 5px 0px 5px 0px;
}
#operacion tbody th{
    width: 150px;	
    text-align: right;
    font-size: 13px;	
    font-weight: normal;
    vertical-align: top;
}
#operacion tbody td{
    text-align:left;
    font-size:10pt;
    font-weight:bold;
    vertical-align:top;
}
#operacion tfoot th{
    text-align:center;
    font-size:13pt;	
}
#operacion h1{
    color:#007f7f; 
    font-weight:bold;	
    font-size:12pt;
}

/* Se genera el estilo usado para todos los formularios los cuales tienen el id de operacion */
#op_ajax{
	border: hidden;
}
#op_ajax thead th{
	background-image:url(../imagenes/nav_bg_png_r.png); 
	background-repeat:repeat-x;	
	text-align:center;
	color:#726647; 
	font-weight:bold;	
	font-size:12pt;
}
#op_ajax tbody th{
	width: 150px;	
	text-align:right;
	font-size:12pt;
	font-weight:normal;
	vertical-align:top;
}
#op_ajax tbody td{
	text-align:left;
	font-size:10pt;
	font-weight:bold;
	vertical-align:top;
}
#op_ajax table {
	border: 1px solid #40970A;
	padding: 2px;
}

#op_ajax tfoot th{
	text-align:center;
	font-size:13pt;
	font-weight:bold;
}

/* Propiedades del listado */
#tbl_listado{
    border: solid 1px #bbb;
    width: 100%;
}

#cpa_listado{
    float: right;
    width:100%;/* Con respecto al div cpa_contenido_form que tiene por arriba */ 
    overflow-x:scroll;
}

/* Estilo usado genericamente para la tabla de listados */
#tbl_listado thead th{	
    background-color:#ddd;
    text-align:center;
    color: #107927;; 
    font-weight:bold;	
    font-size: 12px;
    font-family: verdana;
    padding: 5px 0px 5px 0px;
}
#tbl_listado tbody {
    border: solid 1px #40970A;
}
#tbl_listado tbody th{
    text-align:center;
    font-size:10pt;
    font-weight:bold;
    color:#D0F500;
    background-color:#00086E;
}

#tbl_listado tbody td{
    text-align:left;
    font-size:10pt;
    font-weight:normal;
    border-bottom: solid 1px #CCCCCC; 
    border-right: solid 1px #CCCCCC;
    font-family: verdana;
    font-size: 12px;
    padding: 5px;
}

#tbl_listado tfoot th{
    text-align:center;
    font-size:13pt;
    font-weight:bold;
}

#tbl_listado tbody td a {
    color:#40970A;
    font-size:10pt;
    text-decoration:none;
}

#tbl_listado tbody td a:hover{
	color: #555;
	font-size:10pt;
	text-decoration:none;
}

#tbl_listado h1{
	color:#726647;
	font-weight:bold;	
	font-size:10pt;		
}

#tbl_listado h2{
	color:#726647;
	font-weight:normal;
	font-size:10pt;
	background-color:#c9e5a7;/* dcf1c8 */	
}

#tbl_listado h3{
	font-weight:normal;	
	font-size:10pt;
	background-color:#ecf8e0;	
}
.cls_tit_prueba{
	font-size:10pt;
	font-weight:bold;
	color:#726647;
	background-color:#ABDD87;	
}
.cls_tit_factor{
	font-weight:normal;
	font-size:10pt;
	color:#726647;
	background-color:#c9e5a7;/* dcf1c8 */
}

.cls_tit_variable{
	font-weight:normal;	
	font-size:10pt;
	background-color:#ecf8e0;		
}

/* Estilo usado en listado adicionales */
#tbl_list_adicional thead th{	
	background-color:#ABDD87;
	text-align:center;
	color:#726647; 
	font-weight:bold;	
	font-size:10pt;
}

#tbl_list_adicional tbody {
	border: solid 1px #40970A;
}

#tbl_list_adicional tbody th{
	text-align:center;
	font-size:10pt;
	font-weight:bold;
	color:#D0F500;
	background-color:#00086E;
}

#tbl_list_adicional tbody td{
	text-align:left;
	font-size:10pt;
	font-weight:normal;
	border-bottom: solid 1px #CCCCCC; 
	border-right: solid 1px #CCCCCC;
}

#tbl_list_adicional tfoot th{
	text-align:center;
	font-size:13pt;
	font-weight:bold;
}

#tbl_list_adicional tbody td a {
	color:#40970A;
	font-size:10pt;
	text-decoration:none;
}

#tbl_list_adicional tbody td a:hover{
	color:#E8F6E0;
	font-size:10pt;
	text-decoration:none;
}
/* CAPAS USADAS EN EL FORMULARIO DE ASIGNACION */
/* Capa el listado de evaluados */
#cpa_evaluables{
	float:left;
	width:100%;
	overflow:scroll;
}
/* Capa el listado de asignados */
#cpa_asignados{
	float:left;
	width:100%;
	overflow:scroll;
}

/* Capa para el formulario de asignacion de pruebas, en este se cargan las pruebas que se aplicaran a unos evaluados */
#cpa_prue_aplic{
	width:95%;
	overflow-x:scroll;
	overflow-y:hidden;
}
/* Capa para el formulario de asignacion de pruebas, en este se cargan las pruebas que estan creadas */
#cpa_prue_crea{
	width:95%;
	overflow-x:scroll;
	overflow-y:hidden;
}
/* Estilo usado en listado de personas asignadas a pruebas */
#tbl_list_asignados thead th{	
	background-color:#ABDD87;
	text-align:center;
	color:#726647; 
	font-weight:bold;	
	font-size:10pt;
}

#cpa_list_evaluables{

}

#cpa_list_asignado{
	
}
#tbl_list_asignados tbody {
	border: solid 1px #000000;
}

#tbl_list_asignados tbody th{
	text-align:center;
	font-size:10pt;
	font-weight:bold;
	color:#D0F500;
	background-color:#00086E;
}

#tbl_list_asignados tbody td{
	text-align:left;
	font-size:10pt;
	font-weight:normal;
	border-bottom: solid 1px #CCCCCC; 
	border-right: solid 1px #CCCCCC;
}

#tbl_list_asignados tfoot th{
	text-align:center;
	font-size:13pt;
	font-weight:bold;
}

#tbl_list_asignados tbody td a {
	color:#40970A;
	font-size:10pt;
	text-decoration:none;
}

#tbl_list_asignados tbody td a:hover{
	color:#E8F6E0;
	font-size:10pt;
	text-decoration:none;
}
select.campo{
    height: 25px;
}

.campo{
    width: 150px;
    border: 1px solid #40970A;
    font-size:10pt;
    background-color: #E8F6E0;
    font-family: Helvetica;
    height: 21px;
    margin-bottom: 5px;
    padding-left: 5px;
}

.campo_cmb_ext{
    width: 300px;
    border: 1px solid #40970A;    
    font-size: 13px;
    background-color: #E8F6E0;
    font-family: verdana;    
    margin-bottom: 5px;
}
.campo_num{
    width: 50px;
    border: 1px solid #40970A;	
    font-size:10pt;
    background-color: #E8F6E0;
    font-family: Helvetica;
}
.campo_textArea{
	width:456px;
	height:80px;
	border: 1px solid #40970A;
	border-radius: 0px 0px 10px 0px;
	font-size:10pt;
	background-color: #E8F6E0;
	font-family: Helvetica;
}
/* 2012-10-09 Se agrega el estilo para los text area de envio de correos */
.campo_txtAreaCorreos{
	width:250px;
	height:300px;
	border: 1px solid #40970A;
	border-radius: 0px 0px 10px 0px;
	font-size:10pt;
	background-color: #E8F6E0;
	font-family: Helvetica;
}
/* 2012-10-11 Se agrega el estilo para los text area de envio de correos */
.campo_txtAreaEditable{
	width:90%;
	height:600px;
	border: 1px solid #40970A;
	border-radius: 0px 0px 10px 0px;
	font-size:10pt;
	background-color: #E8F6E0;
	font-family: Helvetica;
}
.cmp_txtTexto{
	width:200px;
	height:100px;
	border: 1px solid #40970A;
	border-radius: 0px 0px 10px 0px;
	font-size:10pt;
	background-color: #E8F6E0;
	font-family: Helvetica;
}
.boton{
  background: #107927;
  color: #FFF;
  padding: 4px 15px;
  text-decoration: none;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 4px;
  margin: 3px;
}
.boton_desactiva{
  /*background: #3b3b9f;
  color: #FFF;
  padding: 7px 15px;
  text-decoration: none;
  font-size: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  */
}
/* pie */
footer {
	clear: both;
	width: 100%;
	height: 50px;
	margin: 0px auto 20px auto;
	border: solid 1px grey;
        color: #107927;
        background-color: #ddd;
}

footer p {
	margin: 0px;
	padding: 13px 0px 0px 0px;
	text-align: center;
	line-height: normal;	
        font-family: verdana;
        font-size: 10px;
}
footer a {
	color: #726647;
	text-decoration:none; 
}
/* Estilos asociados a los divs para los cuestionarios */
#cpa_arb_cuestionario{
	float:left;
	width:30%;
}
/* Se llaman nuevamente en el archivo del arbol jquery.treeview.css*/
.lnk_cues_sin_sele{
	color: #007f7f;
	text-decoration:none; 
}

.lnk_cues_sele{
    background: #FFCC00;
    color: #007f7f;
    text-decoration:none; 
}
.cpa_espacio {
    clear: both;
    margin: 0px;
    padding: 0px;
}
#cpa_list_cuestionario{ /* listado en formulario de cuestionario */
    float:right;
    width:70%;
    height:550px;
}
#cpa_list_cuest_inter{ /* listado en formulario de cuestionario */
    height:500px;
    overflow:scroll;
}

#cpa_operacion_lst{
    margin-bottom: 10px;
}

#cpa_arbol{
	height:400px;
	overflow:scroll;
}
#cpa_oper_pruebas{
	height:150px;
}

#cpa_flujos_reg{
	float:center;
	width:400px;
}
#cpa_prueba_preg{
	width:100%;
}
#html_tbl_preg_opcion{
	width:100%;
	}
#cpa_result_crg{ /* listado en formulario de carga masiva */	
    width:100%;	
    font-family: verdana;
    font-size: 12px;  
    max-height: 700px;
    overflow-y: scroll;
}
#cpa_result_crg li{ /* listado de carga masiva */
    margin-left: 20px;
    font-weight: normal;
}
#cpa_result_crg ul.sub-list li{ /* listado de carga masiva */
    margin-left: 40px;
}
/* Para la capa de correo ya que necesita un tama�o fijo */
#cpa_result_crg_correo{ /* listado en formulario de carga masiva */
    height:300px;
    width:600px;
    overflow:scroll;
    font-family: verdana;
    font-size: 12px;        
}
/* Estilos para listado informe demografico*/
.cpa_titulo_agrup{
    color: #726647;
    font-family: helvetica;
}

.cpa_head_titulo_rep{
    margin-bottom: 30px;
}

.cpa_titulo_repo{
    font-family: helvetica;
    color: #726647;
    margin-bottom: 0px;
    text-align: center;
}

/* Estilos para listado usuarios conectados*/
tr.n_est_1{
    background: #FF463D;
    color:whitesmoke;
}
tr.n_est_2{
    background: #FACC2E;
}
tr.n_est_3{
    background: #F2F5A9;
}
tr.n_est_4{
    background: #A9F5A9;
}

/*Estilos informe historia clinica*/
div.cpa_img_histClinic{
    display: inline-block;
    width: 350px;   
}
div.cpa_lsty_histClinic{
    display: inline-block;
    font-size: 10px;
    width: 300px;   
    text-align: right;
    vertical-align: text-bottom;
}
div.cpa_elmy_intradim_histClinic{    
    height: 24px;
}
div.cpa_elmy_intradom_histClinic{
    height: 43px;
}
div.cpa_elmy_extra_histClinic{
    height: 47px;
}
div.cpa_elmy_estres_histClinic{
    height: 28px;
}
div.cpa_elmy_salud_histClinic{
    height: 40px;
}
/*Contenedores escala x*/
div.cpa_valx_grph{    
    display: inline;
    margin-left: 19px;
    font-size: 12px;
}
div.cpa_valx_grph_cont{
    height: 20px;
    margin-left: 280px;
}
div.cpa_valx_grph_cont_intradim_form_a{
    height: 20px;
    margin-left: 280px;
    margin-bottom: 160px;
}
div.cpa_valx_grph_cont_intradim_form_b{
    height: 20px;
    margin-left: 280px;
    margin-bottom: 250px;
}
div.cpa_valx_grph_cont_intradom_form_a{
    height: 20px;
    margin-left: 280px;
    margin-bottom: 10px;    
}
div.cpa_valx_grph_cont_intradom_form_b{
    height: 20px;
    margin-left: 280px;   
    margin-bottom: 15px;  
}
div.cpa_valx_grph_cont_extra_form_a{
    height: 20px;
    margin-left: 280px; 
    margin-bottom: 150px;
}
div.cpa_valx_grph_cont_extra_form_b{
    height: 20px;
    margin-left: 280px;
    margin-bottom: 150px;
}
div.cpa_valx_grph_cont_salud_form_a{
    height: 20px;
    margin-left: 190px;
}
div.cpa_valx_grph_cont_salud_form_b{
    height: 20px;
    margin-left: 190px;
}
div.cpa_valx_grph_cont_estres_form_a{
    height: 20px;
    margin-left: 260px;
    margin-bottom: 10px;
}
div.cpa_valx_grph_cont_estres_form_b{
    height: 20px;
    margin-left: 260px;
    margin-bottom: 30px;
}
div.cpa_histClinic{
    width: auto;
}
div.cpa_cld_bck{
    display: inline-block;    
    margin-left: -2px;
    margin-right: -2px;
}
div.cpa_img_histClinic{
    border: solid 1px black;
}
.tbl_infHistClin_header{
    font-size: 12px;
    border: solid black 1px;
}
.tbl_infHistClin_header tr{
    border: solid black 1px;
}
td.cld_infHistClin_header_titl{
    text-align: right;
    width: 60px;
    font-weight: bold;
}
td.cld_infHistClin_header_info{
    text-align: left;
    width: 175px;
    height: 30px;
}
div.cpa_infHistClin_header{
    margin: auto;
    text-align: center;
    width: 700px;
    padding: 5px;   
}
div.cpa_infHistClin_header div{
    margin: 10px;   
    font-weight: bold;
}
div.cpa_histClinic_txt_titulo{
    font-weight: bold;
    margin-top: 25px;
    margin-bottom: 25px;
}
div.cpa_infHistClin_inf{
    text-align: center;
}
div.cpa_conv_item{
    display: inline;
    margin-left: 10px;
    margin-right: 10px;
}
div.cpa_conv_color{
    margin-left: 0px;
    font-size: 8px;
}
div.cpa_conv_desc{    
    font-size: 9px;
}
div.cpa_conv{
    margin-bottom: 20px;
}
/*Botones consentimiento informado*/
div.ui-dialog-buttonpane div.ui-dialog-buttonset button.btn_cons_inf{
    margin-right: 355px;
}

/* botones paginación */

#cpa_pag_opc strong{
    
    color: #555;
    padding: 2px;
    font-family: verdana;
    font-size: 12px;
    border: 1px solid #107927;
}
#cpa_pag_opc a{
    color: #fff;
    background-color: #107927;
    padding: 2px;
    text-decoration: none;
    font-family: verdana;
    font-size: 12px;
    border: 1px solid grey;
    margin-bottom: 10px;
}

/* Login */
#form-login{
    margin: auto;
}
#form-login div{
    width: 100%;
    margin-bottom: 10px;
}
#form-login div input[type=text],
#form-login div input[type=password]{
    width: 100%;
    margin: auto;
}

#form-login div input[type=submit],
#form-login div input[type=password]{
    display: block;
    margin: auto;
}

#form-login div label{
    width: 100%;
    font-family: verdana;
    font-size: 14px;
    margin-bottom: 4px;
    display: block;   
}

.login-title{
    font-family: verdana;
    color: #107927;
    text-align: center;
}


/****************************************************/
/*************** Responsive style *******************/
/****************************************************/

.img-responsive{
    width: 100%;
    height: auto;
}
@media (min-width: 1200px)
{
    #wrapper{
        width: 1170px;        
    }
    #logo{
	width: 15%;		        
    }
    #navbar-right{
        width: 84%
    }
    #form-login{
        width: 25%;        
    }
    #cpa_contenido_form{
        width: 85%
    }
    aside{
        width: 15%
    }
    .menu-administracion .itemMenuAdministracion{
        width: 30%;
    }
    .menu-administracion .itemMenuAdministracion a{
        width: 70%;
    }   
}

@media (min-width: 992px) and (max-width: 1199px)
{
    #wrapper{
        width: 970px;        
    }
    #logo{
	width: 15%;		        
    }
    #navbar-right{
        width: 84%
    }
    #form-login{
        width: 30%;        
    }
    #cpa_contenido_form{
        width: 85%
    }
    aside{
        width: 15%
    }
    .menu-administracion .itemMenuAdministracion{
        width: 30%;
    }
    .menu-administracion .itemMenuAdministracion a{
        width: 70%;
    }   
}

@media (min-width: 768px) and (max-width: 991px)  
{
    #wrapper{
        width: 750px;        
    }
     #logo{
	width: 15%;		        
    }
    #navbar-right{
        width: 84%
    }
    #form-login{
        width: 50%;        
    }
    #cpa_contenido_form{
        width: 100%
    }
    aside{
        display: none;
    }
    .menu-administracion .itemMenuAdministracion{
        width: 50%;
    }
    .menu-administracion .itemMenuAdministracion a{
        width: 70%;
    }   
    .hidden-sm{
        display: none;
    }
}

@media (max-width: 767px)
{
    #wrapper{
        width: 100%;        
    }
     #logo{
	width: 35%;		        
        display: block;
        matgin: auto;
    }
    #navbar-right{
        width: 100%
    }
    #form-login{
        width: 100%;        
    }
    .hidden-xs{
        display: none;
    }
    aside{
        display:none;
    }
    #cpa_contenido_form{
        width: 100%;
    }    
    .menu-administracion .itemMenuAdministracion{
        width: 95%;
    }
    
    .menu-administracion .itemMenuAdministracion a{
        width: 100%;
    }   
}

.inner-content{
    padding: 0px 20px;    
    font-family: verdana;
}

.inner-content div{
    margin-bottom: 15px;
}

.inner-content h1{
    color: #aaa;
    font-size: 32px;
    margin-bottom: 15px;    
}

.reprocesar-result{
    overflow-y: scroll;
    max-height: 350px;
    font-size: 14px;
}

.menu-administracion{
    width: 100%;
}

.menu-administracion .itemMenuAdministracion{    
    float: left;   
}
#lnk_excel_todos,
#lnk_hstcl_todos,
.menu-administracion .itemMenuAdministracion a{
    text-decoration: none;
    padding: 6px 12px;
    color: #fff;
    background: #107927;    
    text-align: center;
    display: block;
    border-radius: 4px;
    border: 1px solid grey;
    margin-bottom: 6px;
}
#lnk_excel_todos:hover,
#lnk_hstcl_todos:hover,
.menu-administracion .itemMenuAdministracion a:hover{
    background: #ddd;
    color: #107927;    
}

.campoHorario{    
    border: 1px solid #40970A;
    font-size: 10pt;
    background-color: #E8F6E0;
    font-family: Helvetica;
    height: 21px;
    margin-bottom: 5px;
    padding-left: 5px;
}
#lnk_excel_todos,
#lnk_hstcl_todos{
   width: 30%;
   float: left;
   margin-right: 6px;
}

#cpa_presentar_prueba table{
    width: 100%;
}

#operacion tr td.acepValidation{
    font-weight: normal;
    text-align: center;
    padding: 7px;
    color: #FFF;
}

#operacion tr td.acepValidation span.link{
    cursor: pointer;
    font-weight: bold;
}

#operacion tr td.acepValidation span.link:hover{
    text-decoration: underline;
}

#operacion tr#rowAceptacion{
    background: #1261AB;
}