/* *
 * * NOTA 1 : 
 *
 *
 * * NOTA 2 : 
 *
 *      El ID de los elementos DIV deben comenzar por d_bloq_ctdr_zona_[1 al 10] / con guión abajo
 *
 *      El nombre de la clase para los bloques de los elementos DIV deben comenzar por bloq-ctdr-zona-[1 al 10]
 *
 * * NOTA 3 : Aquí no debe ir diseño, sólo contenedores y posicionamiento de estos, el diseño va en el tema 
 *
   * * * * * * * * */

/* 
   ------------------------------------------------------------------------------------------------------------------ 
	Sección	: 	Configuración global   
   ------------------------------------------------------------------------------------------------------------------ 
*/ 

html,
body { 	
	margin: 10px;
	padding: 0px;
}

html, body, div, a, button, h1, h2, h3, input , label, p , select, span, strong , td , textarea , th , ul {
	font: normal 12px Verdana, sans-serif, Arial, Helvetica;
}

.clear{
	clear: both;
}

/* 
   ------------------------------------------------------------------------------------------------------------------ 
	Sección	: 	CSS BLOQUE SUPERIOR 
   ------------------------------------------------------------------------------------------------------------------ 
*/ 

.bloq-debug {

	/* propiedades de posicionamiento */		
		position: fixed;
		/*float: right;*/
		right: 10px;
		top: 10px;
	
	/* propiedades de tamaño */	
		width: 200px;
		height: 200px;
		
	/* propiedades visualización */	
		overflow: hidden; 
		background-color: rgba(250,250,250,0.8);
		border: 5px solid rgba(0,0,0,0.4);
		display: inline-block;
		z-index: 9999999;
		
}

.bloq-ctdr-zona-1,
.bloq-cabe {

	/* propiedades de posicionamiento */		
		position: relative;
		left: 0px;
		padding: 0px;
		margin: 0px;
		margin-left: 0px;
	
	/* propiedades de tamaño */	
		width: 100%;
		min-height: 5px;
		height: auto;
		
	/* propiedades visualización */	
		/*overflow: visible; 	*/			
		/*display: inline-block;*/
		z-index: 105;
}

.bloq-ctdr-zona-2,
.bloq-ctdr-zona-3,
.bloq-ctdr-zona-4,
.bloq-ctdr-zona-5,
.bloq-ctdr-zona-6,
.bloq-ctdr-zona-7,
.bloq-ctdr-zona-8,
.bloq-ctdr-zona-9,
.bloq-busq {

	/* propiedades de posicionamiento */		
		position: relative; 			
		left: 0px;
		padding: 0px;
		margin: 0px;
		margin-left: 0px;
	
	/* propiedades de tamaño */	
		width: 100%;					
		min-height: 0px;
		height: auto;
		
	/* propiedades visualización */	
		/*border-bottom: 1px solid #D7D7D7;*/

 }

/* contenedor pagina superior cabecera
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
 
 .bloq-ctdr-zona-1-szna,
 .bloq-ctdr-zona-2-szna,
 .bloq-ctdr-zona-3-szna,
 .bloq-ctdr-zona-4-szna,
 .bloq-ctdr-zona-5-szna,
 .bloq-ctdr-zona-6-szna,
 .bloq-ctdr-zona-7-szna,
 .bloq-ctdr-zona-8-szna,
 .bloq-ctdr-zona-9-szna,
 .bloq-ctdr-zona-szna 	{

	/* propiedades de posicionamiento */		
		position: relative;
		top: 0px;
		left: 0px; 					/*nos posicionamos en el centro del navegador*/
		margin: auto;		/*indicamos que el margen izquierdo, es la mitad de la anchura*/
		padding: 0px;
  		bottom: 0px; /* Si definimos esta opción estará en el centro del navegador (centro de la pantalla) */

	/* propiedades de tamaño */	
		width: 1024px;
		/*min-height: 0px;
		height: auto;*/

	/* propiedades visualización */	
		display: block;
		/*display: table;*/
		/*border-spacing: 0px;*/
		text-align: left;
		/*z-index: 10;	*/
}

.bloq-ctdr-zona-10-szna {

	/* propiedades de posicionamiento */		
		position: relative;
		top: 0px;
		left: 0px; 					/*nos posicionamos en el centro del navegador*/
		margin: auto;		/*indicamos que el margen izquierdo, es la mitad de la anchura*/
		padding: 0px;
  		bottom: 0px; /* Si definimos esta opción estará en el centro del navegador (centro de la pantalla) */

	/* propiedades de tamaño */	
		width: 1024px;
		min-height: 30px;
		height: auto;

	/* propiedades visualización */	
		display: block;
		/*display: table;*/
		/*border-spacing: 0px;*/
		text-align: left;
		/*z-index: 10;	*/

}
/* 
   ------------------------------------------------------------------------------------------------------------------ 
	Sección	: 	CSS BLOQUE DE CONTENIDO PRINCIPAL (CONTENIDO DINÁMICO MEDIANTE JQUERY)
   ------------------------------------------------------------------------------------------------------------------ 
*/ 

.bloq-ppal{
	/* propiedades de posicionamiento */		
		position: relative;
		top: 4px;
	/* propiedades de tamaño */	
	/* propiedades visualización */	
}

/* -- panel ppal del contenido lateral izquierdo -- */
.bloq-ppal-zona-late-izqu {
	/* propiedades de posicionamiento */		
		position: relative;
		margin-left: 0px;
		margin-right: 25px;
		float: left;

	/* propiedades de tamaño */	
		min-width: 200px;
		max-width: 500px; 
		width: auto;
		height: 100%;

	/* propiedades visualización */	
		overflow: auto;
}

/* -- panel ppal del contenido lateral derecho -- */
.bloq-ppal-cont-lat-der {

	/* propiedades de posicionamiento */		
		position: relative;
		margin-left: 5px;
		float: left;
	/* propiedades de tamaño */	
		height: 100%;
		width: auto;
		max-width: 500px; 
	/* propiedades visualización */	
		overflow: auto;
}

/* -- panel ppal contenido principal que alberga barra de menú superior y cuerpo html -- */
.bloq-ppal-zona-ppal {
	/* propiedades de posicionamiento */		
		position: relative;
		margin-right: 5px;
		margin-left: 5px;
		display: block;
	/* propiedades de tamaño */	
	/* propiedades visualización */	
}

/* -- panel ppal contenido html -- */ /*#content #render */
.bloq-ppal-zona-ppal-info-ppal {
	/* propiedades de posicionamiento */		
		position: relative;
		height: 100%;
	/* propiedades de tamaño */	
	/* propiedades visualización */	
		overflow: auto;
		white-space: nowrap;
}

/* -- ppanel ppal barra de menú superior -- */ 
.bloq-ppal-zona-ppal-cabe {
	/* propiedades de posicionamiento */		
		position: relative;
		padding: 0px 20px 0 10px;
	/* propiedades de tamaño */	
		height: 40px;
		line-height: 40px;
		margin-left: 3px;
	/* propiedades visualización */	
 }

/* 
   ------------------------------------------------------------------------------------------------------------------ 
	Sección	: 	DIVISORES DE ZONA IZQ - CEN - DER / SEPARADORES (Boton que permitirá¡ mostrar / ocultar el panel)
   ------------------------------------------------------------------------------------------------------------------ 
*/ 

.bloq-ppal-zona-ppal-sepa-izqu {
	/* propiedades de posicionamiento */		
		float: left;
	/* propiedades de tamaño */	
		width: 16px;
		height: 100%;
	/* propiedades visualización */	

}
.bloq-ppal-zona-ppal-sepa-izqu:hover {
	/* propiedades visualización */	
		cursor: pointer;
}
.bloq-ppal-zona-ppal-sepa-izqu.off {
	/* propiedades de posicionamiento */		
   		margin-left: 0;
}
.bloq-ppal-zona-ppal-sepa-izqu.off:hover {
	/* propiedades de posicionamiento */		
   		margin-left: 0;
}
 
/* 
   ------------------------------------------------------------------------------------------------------------------ 
	Sección	: 	PIE DE PÁGINA EN CASO DE SER REQUERIDO
   ------------------------------------------------------------------------------------------------------------------ 
*/ 
 
.bloq-ctdr-zona-10,
.bloq-ppag {

	/* propiedades de posicionamiento */		
		position: fixed; 			
		left: 0px;
		padding: 0px;
		margin: 0px;
		margin-left: 0px;
		bottom: 0;
	
	/* propiedades de tamaño */	
		width: 100%;					
		min-height: 20px;
		height: auto;
}

/* 
   ------------------------------------------------------------------------------------------------------------------ 
	Sección	: 	CSS ESPECIALES PARA LA ZONA DE CARGA PARA CONTENIDO PPAL HTML	
   ------------------------------------------------------------------------------------------------------------------ 
*/ 
 
.__html-iframe{
	/* propiedades de posicionamiento */		
		top: 0;
		left: 0;
		margin: 0;
		padding: 0;
	/* propiedades de tamaño */	
		height: 100%;
		width: 100%;
	/* propiedades visualización */	
		display: none;
		overflow: auto;    
		background-color: #FFF;
}

.__html-idiv{
	/* propiedades de posicionamiento */		
		top: 0;
		left: 0;
		margin: 0;
		padding: 0;
	/* propiedades de tamaño */	
		height: 100%;
		width: 100%;
	/* propiedades visualización */	
		display: none;
		overflow: auto;    
		background-color: #FFF;
}