/*	Grid para layout responsivo
 *	http://simplegrid.info
 *	Author: Marcus Pereira do Couto 	
 *  Date: 2012-01-12
 */

/* Containers */
.clear{ clear: both; }

/* configuraçoes dos blocos */
.c-10,.c-8,.c-7,.c-6,.c-5,.c-4,.c-3,.c-2,.p-30,.p-40,.p-60,.p-70,.p-80,.p-90
{ display:inline; float:left; }

img{
	/*width: 100%;*/
	max-width: 100%;
}

/*padrao caso nao haja suporte a css3 800x600px */
	.grid { width: 720px; }

	.margin 		{margin:14px; }
	.margin-left 	{margin-left:14px; }
	.margin-right 	{margin-right:14px; }
	.margin-top 	{margin-top:14px; }
	.margin-bottom 	{margin-bottom:14px; }

	.padding 		{padding:14px; }
	.padding-left 	{padding-left:14px; }
	.padding-right 	{padding-right:14px; }
	.padding-top 	{padding-top:14px; }
	.padding-bottom {padding-bottom:14px; }

	.h-margin 		{margin:7px; }
	.h-margin-left 	{margin-left:7px; }
	.h-margin-right 	{margin-right:7px; }
	.h-margin-top 	{margin-top:7px; }
	.h-margin-bottom 	{margin-bottom:7px; }

	.h-padding 		{padding:7px; }
	.h-padding-left 	{padding-left:7px; }
	.h-padding-right 	{padding-right:7px; }
	.h-padding-top 	{padding-top:7px; }
	.h-padding-bottom {padding-bottom:7px; }

	
	/* tamanhos dos blocos */


	.c-10{width: 72px;} /* 10 colunas */
	.c-8{width: 90px;} /* 8 colunas */
	.c-6 { width: 120px; } /* 6 colunas */
	.c-5{width: 144px;} /* 5 colunas */
	.c-4{width: 180px;} /* 4 colunas */
	.c-3{width: 240px;} /* 3 colunas */
	.c-2{width: 360px;} /* 2 colunas */
	.p-30{width: 216px;} 
	.p-40{width: 288px;} 
	.p-60{width: 432px;}
	.p-70{width: 504px;} 
	.p-80{width: 576px;} 
	.p-90{width: 648px;} 
	 

@media all and (min-width: 970px) { 
	{}
	.grid { width:960px; }
	.margin 		{margin:20px; }
	.margin-left 	{margin-left:20px; }
	.margin-right 	{margin-right:20px; }
	.margin-top 	{margin-top:20px; }
	.margin-bottom 	{margin-bottom:20px; }

	.padding 		{padding:20px; }
	.padding-left 	{padding-left:20px; }
	.padding-right 	{padding-right:20px; }
	.padding-top 	{padding-top:20px; }
	.padding-bottom {padding-bottom:20px; }

	.h-margin 		{margin:10px; }
	.h-margin-left 	{margin-left:10px; }
	.h-margin-right 	{margin-right:10px; }
	.h-margin-top 	{margin-top:10px; }
	.h-margin-bottom 	{margin-bottom:10px; }

	.h-padding 		{padding:10px; }
	.h-padding-left 	{padding-left:10px; }
	.h-padding-right 	{padding-right:10px; }
	.h-padding-top 	{padding-top:10px; }
	.h-padding-bottom {padding-bottom:10px; }

	.c-10{width: 96px;} /* 10 colunas */
	.c-8{width: 120px;} /* 8 colunas */
	.c-6 { width: 160px; } /* 6 colunas */
	.c-5{width: 192px;} /* 5 colunas */
	.c-4{width: 240px;} /* 4 colunas */
	.c-3{width: 320px;} /* 3 colunas */
	.c-2{width: 480px;} /* 2 colunas */
	.p-30{width: 288px;} 
	.p-40{width: 384px;} 
	.p-60{width: 576px;}
	.p-70{width: 672px;} 
	.p-80{width: 768px;} 
	.p-90{width: 864px;} 

}

@media all and (min-width: 1210px) { 
	{}

	.grid { width:1200px; }
	.margin 		{margin:30px; }
	.margin-left 	{margin-left:30px; }
	.margin-right 	{margin-right:30px; }
	.margin-top 	{margin-top:30px; }
	.margin-bottom 	{margin-bottom:30px; }

	.padding 		{padding:30px; }
	.padding-left 	{padding-left:30px; }
	.padding-right 	{padding-right:30px; }
	.padding-top 	{padding-top:30px; }
	.padding-bottom {padding-bottom:30px; }

	.h-margin 		{margin:15px; }
	.h-margin-left 	{margin-left:15px; }
	.h-margin-right 	{margin-right:15px; }
	.h-margin-top 	{margin-top:15px; }
	.h-margin-bottom 	{margin-bottom:15px; }

	.h-padding 		{padding:15px; }
	.h-padding-left 	{padding-left:15px; }
	.h-padding-right 	{padding-right:15px; }
	.h-padding-top 	{padding-top:15px; }
	.h-padding-bottom {padding-bottom:15px; }


	.c-10{width: 120px;} /* 10 colunas */
	.c-8{width: 150px;} /* 8 colunas */
	.c-6 { width: 200px; } /* 6 colunas */
	.c-5{width: 240px;} /* 5 colunas */
	.c-4{width: 300px} /* 4 colunas */
	.c-3{width: 400px} /* 3 colunas */
	.c-2{width: 600px} /* 2 colunas */
	.p-30{width: 360px;} 
	.p-40{width: 480px;} 
	.p-60{width: 720px;}
	.p-70{width: 840px;} 
	.p-80{width: 960px;} 
	.p-90{width: 1080px;} 
}



