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

/* 
   
   FRAMEWORK CSS
   == RECONOCIMIENTOS Y DEFINICIONES: ========================
   Inicialmente basado en el Blueprint CSS Grid Generator (2008-04-17) [http://kematzy.com/blueprint-generator/]. El problema es que el BP genera demasiado codigo y lo que yo buscaba era un css absolutamente basico, asi que hice una adaptacion libre con un solo objetivo: generar un framework css simple y basico, manipulable, escalable, crossbrowser y que requiera la menor cantidad de css/html posible. Eliminé el concepto de fila y columna reemplazandolo por el elemento CAJA, que es un contenedor generico con un ancho de 100% que sirve para cualquier conjunto de elementos que necesite ser agrupado.
   
   == RESET CSS ========================
   * Basado en el css reset de Blueprint [http://developer.yahoo.com/yui/reset/] con modificaciones y ajustes personalizados.
   
	
   == VERSION: ======================== 
    * 1.1
	* 26/12/2008
	
	
   == PRUEBAS DE BROWSER: ========================
	 * Firefox (Windows, Ubuntu)
   	 * Explorer 7, 6 y 5.5 (Windows)
	 * Opera (Windows)
	 * Chrome 0.2.1 (Windows)
	 * Safari (Windows)
	 

   == ESTRUCTURA: ========================
    * Ancho:					960 px
    * Numero de columnas:		12
    * Ancho de columna:         60 px
    * Margen de columna:        20 px
   ======================================
   


	/*EXTRAS -------------------------------------------------------------*/
	/* Aplicar para ver la grilla */
	.verGrilla { background: #fff url(../images/grid.png) repeat-y; }
	
	/*Usar para dar alto 100% a una columna*/
	.col100alto { padding-bottom: 30000px; margin-bottom: -30000px; } 		
	/*--------------------------------------------------------- FIN EXTRAS*/
	

	/*Contenedor de todos los elementos del sitio - Controla la posicion del sitio: derecha, centro o izquierda */
	/*body { text-align: center; background: #eee; }*/

	
	/*Contenedor de todos los elementos del sitio - Controla la posicion del sitio: derecha, centro o izquierda */
	#contenedor { margin: 0 auto; padding: 0 10px; width: 940px; _width: 960px; text-align: left; overflow: hidden; }	
	
	/*Unidad contenedora generica, aplicar siempre que existen 2 o mas columnas paralelas o como contenedor basico.*/
	.caja { width: 100%; overflow: hidden; margin-bottom: 0px; display: block; overflow: hidden; }

	
	/* COLUMNAS */
	/* Control del flotado y margen */
	.col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11, .col12, .col50  { float: left; margin: 0 0 0 0; overflow: hidden; }
	
	/* Importante: quita el margen extra a la ultima columna de cada fila para encajar */
	.final { margin-right: 0; }
	
	/* Usar estas clases para determinar los anchos y cantidad de columnas. Siempre en relacion al class .contenedor */
	.col1  { width: 60px; }
	.col2  { width: 140px; }
	.col3  { width: 240px; height:240px; }
	.col4  { width: 300px; }
	.col5  { width: 380px; }
	.col6  { width: 460px; }
	.col7  { width: 540px; }
	.col8  { width: 620px; }
	.col9  { width: 700px; }
	.col10 { width: 780px; }
	.col11 { width: 860px; }
	.col12 { width: 940px; margin: 0; }
	.col50 { width: 48.15%;  }
        
	/*--------------------------------------------------------- FIN COLUMNAS*/