/*
 * author daniel.sepulveda
 */

/*** Clases Login ***/
*{
  margin:0px;
  padding:0px;
  outline:none;
}

body {
  font-family: 'shannonbookregular';
  font-size:    12px !important; 
  background-color: #FCFCFF; /*Romance*/
}

h1{
	color:#ffffff;
	font-size:30px;
	font-family: 'shannonbookregular';
	margin:15px;
	line-height:30px;
}

.header {
    background-color: #98A9C1;
    width: 100%;
}

table {
  font-family:  Arial, Helvetica, sans-serif;
  font-size: 1em;
  width: 100%;
  text-align: left;
  border-collapse: collapse;
}

img {
  border:none;
}

.titulo{
  font-family: Arial, Helvetica, sans-serif;
  font-size:  18px;
  color:    #A7A6AA;
  font-weight: bold;
}

.titulo_area {
  font-weight: bold;
  font-size:   1.1em;
  margin:      12px 0 12px 0;
  padding:     0 0 .2em;
}

.titulo_identificacion{
	color:#00a0a4;
	font-size:16px;
	line-height:32px;
	font-weight:700;
	background-image:url(../img/bullet_identificacion.png);
	background-repeat:no-repeat;
	background-position:0px ;
	padding-left:22px;
	height:30px;
}
.area {
  margin: 10px;
  padding:10px;
  /*background-color: #F7F3F7; original area*/
  /*background-color: #F6F4F8;*/
}

.seccion{
  margin: 5px 0px;
  text-align: left;
  color: #010101;

	padding:10px;
}

.btnCerrar{
	background-color:#00a0a4;
	background-image:url(../img/bullet_btn_cerrarsesion.png);
	background-repeat:no-repeat;
	background-position: 5px;
}

.btn_ActulizarDatos{
	background-color:#00a0a4;
	background-image:url(../img/bullet_btn_ActualizarDatos.png);
	background-repeat:no-repeat;
	background-position: 5px;
}

.btn_CambioClave{
	background-image:url(../img/bullet_btn_cambioClave.png);
	background-repeat:no-repeat;
	background-position: 5px;
	background-color:#00a0a4;
	padding: 5px 10px 5px 55px;
	color:#FFF;
	display:block;
	cursor:pointer;
	text-decoration:none;
	font-size:16px;
    line-height: 16px;
    font-family: 'shannonbookregular';
}

.btn_guardar{
	background-image:url(../img/bullet_btn_guardar.png);
	background-repeat:no-repeat;
	background-position:5px;
}
	
.btn_volver{
	background-image:url(../img/bullet_btn_volver.png);
	background-repeat:no-repeat;
	background-position:5px;
}
	
.btn_descargaExcel{
	background-image:url(../img/bullet_btn_excel.png);
	background-repeat:no-repeat;
	background-position:5px;
}
	
	

.btn_ActulizarDatos,  .btnCerrar, .btn_guardar, .btn_volver, .btn_descargaExcel{
    background-color:#00a0a4;
    padding: 5px 10px 5px 30px;
    color:#FFF;
    display:block;
    cursor:pointer;
    text-decoration:none;
    font-size:16px;
    line-height: 16px;
    font-family: 'shannonbookregular';
}

.seccion h1 {
  /*font-size:    1.2em;
  color:        #CC6600;
  text-align:   left;
  margin:       1em 0 1em;
  padding:      0 0 .2em;
  border-bottom:1px solid #CC6600;*/
}

.seccion h2 {
  font-size:    1.1em;
  text-align:   left;
  margin:       1em 0 1em;
  padding:      0 0 .2em;
  border-bottom:1px solid #ccc;
}

.legend {
  font-size:  16px;
  color:    #009fa0;
  font-weight: bold;
}

.toolbar {
  background-color: #EDECEB;
  padding: 8px 8px 8px 8px;
  margin: 12px 0 12px auto; 
  text-align: left;
}

/********************* login   ***********/
.contenedorLogos{
width: 100%;
height: 91px;
}
#logo {
	width:  78px;
 	height: 72px;
 	float:  left;
	padding-left:15px;
	padding-top:15px;
}

.logoAplicacion{
    float: left;
    width: 200px;
    height: 70px;
    padding-left: 25px;
    padding-top: 30px;
}

.infoLogin{
width:          70%;
padding:        50px;
margin-left:    150px;
margin-right:   auto;
}

#sesion, #clave{
	width:300px;
	height:24px;
	font-size:14px;
	line-height:14px;}
	
#buscar_sesion{
	background-color:#00a0a4;
	background-image:url(../img/bullet_btn_ingresar.png);
	background-repeat:no-repeat;
	background-position: 5px;
	font-size:16px;
	line-height:16px;
	font-family: 'shannonbookregular';
	text-decoration:none;
	padding:5px 10px;
	text-align:right;

}

/******************************************************/
.infoHome{
	width:100%;
	background-color:#00a0a4;
}

.infoHome h2{
	color:#FFF;
	padding:25px;
	font-size:18px;
	font-weight:300;
}

div.informacion {
  padding: 12px 12px 12px 70px;
  
  font-size:1.2em;
  min-height: 48px;
  margin: 12px 0 0 12px;
  border: 1px solid #aaaaaa;
  
  background-color:#00a0a4;
  background-position: 10px 10px;
  background-repeat: no-repeat;
  
  background-image: url("../img/information.png");
	color:#fff;
}

div.informacion .texto_primario{
  font-weight: bold;
  font-size: 1.3em;
	padding-top:15px;
}

div.informacion .texto_secundario{
  color: #fff; /*Davy's grey*/
}
/******************************************************/

/******************************************************/
div.seguridad {
  padding-left: 50px;
  padding-top: 12px;
  padding-bottom: 12px;
  
  font-size:1.2em;
  min-height: 48px;
  margin: 12px 0 0 12px;
  border: 1px solid #aaaaaa;
  
  background-color:#FFFFF0;
  
  background-position: 5px 5px;
  background-repeat: no-repeat;
  
  background-image: url("../img/32px-Oxygen480-status-security-low.svg.png");
}

div.seguridad .texto_primario{
  font-weight: bold;
  font-size: 1.3em;
}

div.seguridad .texto_secundario{
  color: #555555; /*Davy's grey*/
}
/******************************************************/

/*** Link destacado de color mayormente rojo ***/   
/* unvisited link */
.LinkRojo a:link {
  color: #d6060f;/*#b0556a;*/
}
/* visited link */
.LinkRojo a:visited {
  color: #d6060f;/*#7e3b4a;*/
}
/* mouse over link */
.LinkRojo a:hover {
  color: #b76678;
}
/* selected link */
.LinkRojo a:active {
  color: #b76678;
}

/*** Link destacado de color mayormente azul ***/   
/* unvisited link */
.LinkAzul a:link {
  color: #060fd6;/*#044e8c;*/
}
/* visited link */
.LinkAzul a:visited {
  color: #060fd6;/*#03325a;*/
}
/* mouse over link */
.LinkAzul a:hover {
  color: #0677d6;
}
/* selected link */
.LinkAzul a:active {
  color: #056abe;
}
/*********************/
.validation_error{
  border: 1px solid #FF5050;
  outline: 1px solid #FF5050 !important;
}

.validation_error select{
  background-color: #FF2A00;
}

.validation_error option 
{
  background-color:white;
}

.placeholder { color: #aaa; }
/*****************************************/

#PagosEncuestadores {
 /* position: relative;
  float: left;
  width: 90%;*/
}

#buscar_entrada{
  display: inline-block;
}

.boton_buscar {
  display: inline-block;
  min-width: 46px;
  text-align: center;
  color: #444;
  font-size: 11px;
  font-weight: bold;
  height: 27px;
  padding: 0 8px;
  line-height: 27px;
  border-radius: 2px;
  border: 1px solid #dcdcdc;
  background-color: #3D81EF;
  background-image: url('../img/toolbar_find16.png');
  cursor: pointer;
  background-repeat:no-repeat;
  background-position:center;
}

#busqueda_avanzada{
  display: inline-block;
}

.boton{
  background-color:  #326CB3;
  font-size:16px;
  padding:5px 10px;
  height:30px;
  color:#fff;
  cursor:pointer;
  width: 112px;
  border:none;
}


#data th{
  border-top: 1px solid #c0c0c0;
  border-left: 1px solid #c0c0c0;
  border-right: 1px solid #c0c0c0;
  border-bottom: 1px solid #c0c0c0;
  padding: 2px;
  margin: 0px;
  font-family: Arial;
  font-size: 7pt;
  font-weight: bold;
  text-align: center;
  /*color: #7F7F7F;*/
}

#data td {
  border-bottom: 1px solid #CCC;
  padding: 0 0.5em;
  border-left: 1px solid #CCC;
  border-right: 1px solid #CCC;
  /*color: #909090;*/
}

.subt {
  border-bottom: 1px solid #CCC;
  padding: 0 0.5em;
  border-left: 1px solid #CCC;
  border-right: 1px solid #CCC;
}

/******************************************************/

div.advertencia {
    padding: 12px 12px 12px 50px;
    font-size: 1.2em;
    min-height: 48px;
    margin: 12px 0 0 0;
    border: 1px solid #D94544;
    background-color: #FDDFDF;
    background-position: 5px 5px;
    background-repeat: no-repeat;
    background-image: url(../img/gnome_dialog_warning.png);
}

    div.advertencia .texto_primario {
        font-weight: bold;
        font-size: 1.4em;
        color: #1A1A1A;
    }

    div.advertencia .texto_secundario {
        color: #5F3F3F;
        font-size: 1.3em;
    }
/******************************************************/

/****** Colo Azul Principal ******/
.SanMarino {
  background-color: #326CB3;
  color: #FCFCFF;
}

  /***Azul m�s claro***/
  .Iceberg {
    background-color: #7BA5D8;
    color: #FCFCFF;
  }
  
  .TuftsBlue {
    background-color: #5185C4;
    color: #FCFCFF;
  }
  
  /***Azul m�s oscuro***/
  .ToryBlue {
    background-color: #1055A8;
    color: #FCFCFF;
  }
  
  .DarkCerulean {
    background-color: #0A3F7F;
    color: #FCFCFF;
  }
  
  /****** Triadicos ******
   * Si queremos transmitir vitalidad y buscar un contraste 
   * manteniendo la uniformidad en la apariencia de nuestro sitio web.
   */
  .Hibiscus {
    background-color: #B3326C;
    color: #FCFCFF;
  }
  
  .GreenRYB{
    background-color: #6CB332;
    color: #FCFCFF;
  }
  
    .JungleGreen{
      background-color: #27B38C;
      color: #FCFCFF;
    }
    
    .GreenMunsell{
      background-color: #02A87A;
      color: #FCFCFF;
    }
    
    .TropicalRainForest{
      background-color: #007F5C;
      color: #FCFCFF;
    }
  /***********************/
  
  /****** TETR�DICA ******
   * Se compone b�sicamente de dos pares complementarios 
   * por lo que es una combinaci�n de colores muy vibrantes y equilibrado.
   */
  .BrightSunT{
    background-color: #009fa0;
    color: #fff;
    padding: 5px;
  }
  .GovernorBayT{
    background-color: #4A3CBC;
    color: #FCFCFF;
  }
  .YellowOrangeT{
    background-color: #FFB137;
    color: #000040;
  }
  /***********************/
 
  /****** Analogos ******
   * Este esquema de color se encuentra en la naturaleza y es muy agradable a la vista. 
   * Sin embargo, no ser� adecuado si se est� buscando una combinaci�n de alto contraste.
   */
  .GovernorBay{
    background-color: #3832B3;
    color: #FCFCFF;
  }
  
  .Pelorous{
    background-color: #32ADB3;
    color: #FCFCFF;
  }
  /***********************/
 
  /****** Adjacente ******
   * 
   * 
   */
  .GovernorBayA{
    background-color: #4A3CBC;
    color: #FCFCFF;
  }
  .YellowOrangeA{
    background-color: #FFB137;
    color: #000040;
  }
  
  .JungleGreenA {
    background-color: #27B38C;
    color: #FCFCFF;
  }
  
  /***********************/
  
 
  /****** Complementario ******
   * El alto contraste de la combinaci�n de colores del complemento es ideal 
   * si necesita que su sitio web sea llamativo. 
   */
  .Copper{
    background-color: #B37932;
    color: #FCFCFF;
  }
  /****************************/


