
/*
*, *:before, *:after {
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
*/

.jgrid_square *, .jgrid_square:before, .jgrid_square:after {
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.jgrid_square, .jgrid_square * {
	margin: 0px;
	padding: 0px;
	display: block;
	-moz-box-sizing: border-box;
	box-sizing: border-box; 
}
.jgrid_square div {float:left;}
.jgrid_square {display: inline-block;}

/* --------------------------------------------------------------------------------------------- BIG */

	.jgrid_square_big_border {
		position: relative;
		width: 51px; 
		height: 47px;
		margin: 0px 0px;
		border-left: solid 1px #aeadae;
		border-right: solid 1px #aeadae;
	}

	/* *********************************** squareo menor 1 */
	.jgrid_square_big1 {
		position: relative;
		width: 38px; 
		height: 38px;
		margin: 11.55px 0;
		z-index: 12;
	}

	/* encaixe no big */
	.jgrid_square_big_border .jgrid_square_big1 {top: -9px; left: 4.4px;}


	/* *********************************** squareo menor 2 */
	.jgrid_square_big2 {
		position: relative;
		width: 30px;
		height: 17.32px;
		margin: 8.66px 0;
		z-index: 12;
	}

	/* encaixe no big */
	.jgrid_square_big_border .jgrid_square_big2 {top: -3px; left: 9.5px;}

	/* *********************************** squareo menor 3 */
	.jgrid_square_big3 {
		position: relative;
		width: 20px; 
		height: 11.55px;
		margin: 5.77px 0;
		z-index: 12; 
	}

	/* encaixe no big */
	.jgrid_square_big_border .jgrid_square_big3 {top: 2px; left: 14.5px;}


	/* Espacamentos  */
	.jgrid_square_line_big_a {margin-left: 0px;}
	.jgrid_square_line_big_b {margin-left: 0px;}

/* --------------------------------------------------------------------------------------------- MED */

	.jgrid_square_med_border {
	  position: relative;
		width: 35px; 
		height: 35px;
		margin: 0px 0;
		border-left: solid 1px #aeadae;
		border-right: solid 1px #aeadae;
	}

	/* *********************************** squareo menor 1 */
	.jgrid_square_med1 {
		position: relative;
		width: 30px;
		height: 30px;
		margin: 0px 0;
		z-index: 12;
	}

	/* encaixe no med */
	.jgrid_square_med_border .jgrid_square_med1 { top: 0px;left: 3.9px;}


	/* *********************************** squareo menor 2 */
	.jgrid_square_med2 {
		position: relative;
		width: 20px; 
		height: 11.55px;
		margin: 5.77px 0;
		z-index: 12; 
	}

	/* encaixe no med */
	.jgrid_square_med_border .jgrid_square_med2 {top: 1px; left: 8.9px;}


	/* *********************************** squareo menor 3 */
	.jgrid_square_med3 {
		position: relative;
		width: 14px; 
		height: 14px;
  		margin: 4.04px 0;
  		border-radius: 50%;
		z-index: 12; 
	}
	/* encaixe no med */
	.jgrid_square_med_border .jgrid_square_med3 {top: 0.5px; left: 11.9px;}

	/* Espacamentos  */
	.jgrid_square_line_med_a {margin-left: 0px;clear: both;}
	.jgrid_square_line_med_b {margin-left: 0px;clear: both;}

/* --------------------------------------------------------------------------------------------- MIN */

	.jgrid_square_min_border {
	  	position: relative;;
		width: 29px; 
		height: 29px;
		margin: 0px 0;
		background-color: transparent;
		border-left: solid 1px transparent;
		border-right: solid 1px transparent;
	}

	/* *********************************** squareo menor 1 */
	.jgrid_square_min1 {
		position: relative;
		width: 28px;
		height: 28px;
		margin: 4px 0;
		z-index: 12;
	}

	/* encaixe no min */
	.jgrid_square_min_border .jgrid_square_min1 { top: -5.5px;left: -0.5px;}


	/* *********************************** squareo menor 2 */
	.jgrid_square_min2 {
		position: relative;
		width: 20px; 
		height: 11.55px;
		margin: 5.77px 0;
		z-index: 12; 
	}

	/* encaixe no min */
	.jgrid_square_min_border .jgrid_square_min2 {top: 1px; left: 8.9px;}


	/* *********************************** squareo menor 3 */
	.jgrid_square_min3 {
		position: relative;
		width: 14px; 
		height: 14px;
  		margin: 4.04px 0;
  		border-radius: 50%;
		z-index: 12; 
	}
	/* encaixe no min */
	.jgrid_square_min_border .jgrid_square_min3 {top: 0.5px; left: 11.9px;}

	/* Espacamentos  */
	.jgrid_square_line_min_a {margin-left: 0px;clear: both;}
	.jgrid_square_line_min_b {margin-left: 0px;clear: both;}

/* --------------------------------------------------------------------------------------------- MICRO */

	.jgrid_square_mic_border {
	  	position: relative;
		width: 22px; 
		height: 22px;
		margin: 0px 0;
		background-color: transparent;
		border-left: solid 1px transparent;
		border-right: solid 1px transparent;
	}

	/* *********************************** squareo menor 1 */
	.jgrid_square_mic1 {
		position: relative;
		width: 20px; 
		height: 20px;
		margin: 4px 0;
		z-index: 12; 
	}

	/* encaixe no mic */
	.jgrid_square_mic_border .jgrid_square_mic1 {top: 0px; left: 0px;}


	/* *********************************** squareo menor 2 */
	.jgrid_square_mic2 {
		position: relative;
		width: 18px; 
		height: 18px;
		margin: 5.77px 0;
		z-index: 12; 
	}

	/* encaixe no mic */
	.jgrid_square_mic_border .jgrid_square_mic2 {top: 1px; left: 8.9px;}


	/* *********************************** squareo menor 3 */
	.jgrid_square_mic3 {
		position: relative;
		width: 14px; 
		height: 14px;
  		margin: 4.04px 0;
  		border-radius: 50%;
		z-index: 12; 
	}
	/* encaixe no mic */
	.jgrid_square_mic_border .jgrid_square_mic3 {top: 0.5px; left: 11.9px;}

	/* Espacamentos  */
	.jgrid_square_line_mic_a {margin-left: 0px;clear: both;}
	.jgrid_square_line_mic_b {margin-left: 0px;clear: both;}



/* --------------------------------------------------------------------------------------------- MICRO */

	.jgrid_square_nano_border {
	  	position: relative;
		width: 15px; 
		height: 15px;
		margin: 0px 0;
		background-color: transparent;
		border-left: solid 1px transparent;
		border-right: solid 1px transparent;
	}

	/* *********************************** squareo menor 1 */
	.jgrid_square_nano1 {
		position: relative;
		width: 14px; 
		height: 14px;
		margin: 4px 0;
		z-index: 12; 
	}

	/* encaixe no nano */
	.jgrid_square_nano_border .jgrid_square_nano1 {top: 0px; left: 0px;}


	/* *********************************** squareo menor 2 */
	.jgrid_square_nano2 {
		position: relative;
		width: 12px; 
		height: 12px;
		margin: 5.77px 0;
		z-index: 12; 
	}

	/* encaixe no nano */
	.jgrid_square_nano_border .jgrid_square_nano2 {top: 1px; left: 8.9px;}


	/* *********************************** squareo menor 3 */
	.jgrid_square_nano3 {
		position: relative;
		width: 12px; 
		height: 12px;
  		margin: 4.04px 0;
  		border-radius: 50%;
		z-index: 12; 
	}
	/* encaixe no nano */
	.jgrid_square_nano_border .jgrid_square_nano3 {top: 0.5px; left: 11.9px;}

	/* Espacamentos  */
	.jgrid_square_line_nano_a {margin-left: 0px;clear: both;}
	.jgrid_square_line_nano_b {margin-left: 0px;clear: both;}




/* --------------------------------------------------------------------------------------------- PICO */

	.jgrid_square_pico_border {
	  	position: relative;
		width: 9px; 
		height: 9px;
		margin: 0px 0;
		background-color: transparent;
		border-left: solid 1px transparent;
		border-right: solid 1px transparent;
	}

	/* *********************************** squareo menor 1 */
	.jgrid_square_pico1 {
		position: relative;
		width: 8px; 
		height: 8px;
		margin: 4px 0;
		z-index: 12; 
	}

	/* encaixe no pico */
	.jgrid_square_pico_border .jgrid_square_pico1 {top: 0px; left: 0px;}


	/* *********************************** squareo menor 2 */
	.jgrid_square_pico2 {
		position: relative;
		width: 12px; 
		height: 12px;
		margin: 5.77px 0;
		z-index: 12; 
	}

	/* encaixe no pico */
	.jgrid_square_pico_border .jgrid_square_pico2 {top: 1px; left: 8.9px;}


	/* *********************************** squareo menor 3 */
	.jgrid_square_pico3 {
		position: relative;
		width: 12px; 
		height: 12px;
  		margin: 4.04px 0;
  		border-radius: 50%;
		z-index: 12; 
	}
	/* encaixe no pico */
	.jgrid_square_pico_border .jgrid_square_pico3 {top: 0.5px; left: 11.9px;}

	/* Espacamentos  */
	.jgrid_square_line_pico_a {margin-left: 0px;clear: both;}
	.jgrid_square_line_pico_b {margin-left: 0px;clear: both;}


/*
	Estilos 
		- Controle de borda
			6 bordas
			- primeira borda: superior esquerda;
			- ultima borda: esquerda;

		       __
		     /    \
		    |      |
		    |      |
		     \    /
		       --

*/
.jgrid_square_border_no_b1:before {border-top-color: transparent}
.jgrid_square_border_no_b2:before {border-right-color: transparent;}
.jgrid_square_border_no_b3 {border-right-color: transparent;}
.jgrid_square_border_no_b4:after {border-bottom-color: transparent;}
.jgrid_square_border_no_b5:after {border-left-color: transparent;}
.jgrid_square_border_no_b6 {border-left-color: transparent;}

/* nenhuma borda */
.jgrid_square_bnb { border-right-color: transparent; border-left-color: transparent; }

/*
	Estilos 
		- Espacamentos
*/
/* organizacao de linhas e squareos */
.jgrid_square_line {clear: both;}
.jgrid_square_cell {}
.jgrid_square_line_first {}
.jgrid_square_line_second {}
.jgrid_square_line_middle {}
.jgrid_square_line_last {}
/* aproximar proximas linhas */
.jgrid_square_line_first, .jgrid_square_line_middle, .jgrid_square_line_second { margin-bottom: 0px; }
/* apenas 1 linha */
.jgrid_square_line_single {}
/* .jgrid_square_line_first { margin-bottom: -25px; } */


