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

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

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

	.jgrid_hive_big_border {
		position: relative;
		width: 50px; 
		height: 28.87px;
		background-color: #ffffff;
		margin: 15px 0;
		border-left: solid 1px #aeadae;
		border-right: solid 1px #aeadae;
	}

	.jgrid_hive_big_border:before, .jgrid_hive_big_border:after {
		content: "";
		position: absolute;
		z-index: 1;
		width: 34.01px;
		height: 33.06px;
		/*
		width: 35.01px;
		height: 35.06px;
		*/
		-webkit-transform: scaleY(0.5774) rotate(-45deg);
		-ms-transform: scaleY(0.5774) rotate(-45deg);
		transform: scaleY(0.5774) rotate(-45deg);
		background-color: inherit;
		left: 7.3223px;
	}

	.jgrid_hive_big_border:before {
		top: -17.5px;
		border-top: solid 1.4142px #aeadae;
		border-right: solid 1.4142px #aeadae;
	}

	.jgrid_hive_big_border:after {
		bottom: -17.1px;
		border-bottom: solid 1.4142px #aeadae;
		border-left: solid 1.4142px #aeadae;
	}

	/* *********************************** hiveo menor 1 */
	.jgrid_hive_big1 {
		position: relative;
		width: 40px; 
		height: 23.09px;
		margin: 11.55px 0;
		z-index: 12;
	}
	.jgrid_hive_big1:before, .jgrid_hive_big1:after {
		content: ""; position: absolute; width: 0;
		border-left: 20px solid transparent;
		border-right: 20px solid transparent;
	}
	.jgrid_hive_big1:before {
		bottom: 100%;
		border-bottom-width: 11.55px; border-bottom-style: solid;
	}
	.jgrid_hive_big1:after {
		top: 100%;
		width: 0;
		border-top-width: 11.55px; border-top-style: solid;
	}
	/* encaixe no big */
	.jgrid_hive_big_border .jgrid_hive_big1 {top: -9px; left: 4.4px;}


	/* *********************************** hiveo menor 2 */
	.jgrid_hive_big2 {
		position: relative;
		width: 30px;
		height: 17.32px;
		margin: 8.66px 0;
		z-index: 12;
	}
	.jgrid_hive_big2:before, .jgrid_hive_big2:after {
		content: ""; position: absolute; width: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
	}
	.jgrid_hive_big2:before {
		bottom: 100%;
		border-bottom-width: 8.66px; border-bottom-style: solid;
	}
	.jgrid_hive_big2:after {
		top: 100%;
		width: 0;
		border-top-width: 8.66px; border-top-style: solid;
	}

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

	/* *********************************** hiveo menor 3 */
	.jgrid_hive_big3 {
		position: relative;
		width: 20px; 
		height: 11.55px;
		margin: 5.77px 0;
		z-index: 12; 
	}
	.jgrid_hive_big3:before, .jgrid_hive_big3:after {
		content: ""; position: absolute; width: 0;
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
	}
	.jgrid_hive_big3:before {
		bottom: 100%;
		border-bottom-width: 5.77px; border-bottom-style: solid;
	}
	.jgrid_hive_big3:after {
		top: 100%;
		width: 0;
		border-top-width: 5.77px; border-top-style: solid;
	}
	/* encaixe no big */
	.jgrid_hive_big_border .jgrid_hive_big3 {top: 2px; left: 14.5px;}


	/* Espacamentos  */
	.jgrid_hive_line_big_a {margin-left: 0px;}
	.jgrid_hive_line_big_b {margin-left: 24px;}

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

	.jgrid_hive_med_border {
	  position: relative;
		width: 40px; 
		height: 23.09px;
		margin: 11.55px 0;
		background-color: #ffffff;
		border-left: solid 1px #aeadae;
		border-right: solid 1px #aeadae;
	}

	.jgrid_hive_med_border:before, .jgrid_hive_med_border:after {
		content: "";
		position: absolute;
		z-index: 1;
		width: 26px;
		height: 27.06px;
		-webkit-transform: scaleY(0.5774) rotate(-45deg);
		-ms-transform: scaleY(0.5774) rotate(-45deg);
		transform: scaleY(0.5774) rotate(-45deg);
		background-color: inherit;
		left: 5.1px;
	}

	.jgrid_hive_med_border:before {
		top: -13.6777px;
		border-top: solid 1.4142px #aeadae;
		border-right: solid 1.4142px #aeadae;
	}

	.jgrid_hive_med_border:after {
		bottom: -13.9px;
		border-bottom: solid 1.4142px #aeadae;
		border-left: solid 1.4142px #aeadae;
	}

	/* *********************************** hiveo menor 1 */
	.jgrid_hive_med1 {
		position: relative;
		width: 30px;
		height: 17.32px;
		margin: 8.66px 0;
		z-index: 12;
	}
	.jgrid_hive_med1:before, .jgrid_hive_med1:after {
		content: ""; position: absolute; width: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
	}
	.jgrid_hive_med1:before {
		bottom: 100%;
		border-bottom-width: 8.66px; border-bottom-style: solid;
	}
	.jgrid_hive_med1:after {
		top: 100%;
		width: 0;
		border-top-width: 8.66px; border-top-style: solid;
	}
	/* encaixe no med */
	.jgrid_hive_med_border .jgrid_hive_med1 { top: -5.5px;left: 3.9px;}


	/* *********************************** hiveo menor 2 */
	.jgrid_hive_med2 {
		position: relative;
		width: 20px; 
		height: 11.55px;
		margin: 5.77px 0;
		z-index: 12; 
	}
	.jgrid_hive_med2:before, .jgrid_hive_med2:after {
		content: ""; position: absolute; width: 0;
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
	}
	.jgrid_hive_med2:before {
		bottom: 100%;
		border-bottom-width: 5.77px; border-bottom-style: solid;
	}
	.jgrid_hive_med2:after {
		top: 100%;
		width: 0;
		border-top-width: 5.77px; border-top-style: solid;
	}

	/* encaixe no med */
	.jgrid_hive_med_border .jgrid_hive_med2 {top: 1px; left: 8.9px;}


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

	/* Espacamentos  */
	.jgrid_hive_line_med_a {margin-left: 0px;clear: both;}
	.jgrid_hive_line_med_b {margin-left: 20px;clear: both;}

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

	.jgrid_hive_min_border {
	  	position: relative;;
		width: 32px; 
		height: 25.09px;
		margin: 9.55px 0;
		background-color: transparent;
		border-left: solid 1px transparent;
		border-right: solid 1px transparent;
	}

	/* *********************************** hiveo menor 1 */
	.jgrid_hive_min1 {
		position: relative;
		width: 30px;
		height: 17.32px;
		margin: 8.66px 0;
		z-index: 12;
	}
	.jgrid_hive_min1:before, .jgrid_hive_min1:after {
		content: ""; position: absolute; width: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
	}
	.jgrid_hive_min1:before {
		bottom: 100%;
		border-bottom-width: 8.66px; border-bottom-style: solid;
	}
	.jgrid_hive_min1:after {
		top: 100%;
		width: 0;
		border-top-width: 8.66px; border-top-style: solid;
	}
	/* encaixe no min */
	.jgrid_hive_min_border .jgrid_hive_min1 { top: -5.5px;left: -0.5px;}


	/* *********************************** hiveo menor 2 */
	.jgrid_hive_min2 {
		position: relative;
		width: 20px; 
		height: 11.55px;
		margin: 5.77px 0;
		z-index: 12; 
	}
	.jgrid_hive_min2:before, .jgrid_hive_min2:after {
		content: ""; position: absolute; width: 0;
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
	}
	.jgrid_hive_min2:before {
		bottom: 100%;
		border-bottom-width: 5.77px; border-bottom-style: solid;
	}
	.jgrid_hive_min2:after {
		top: 100%;
		width: 0;
		border-top-width: 5.77px; border-top-style: solid;
	}

	/* encaixe no min */
	.jgrid_hive_min_border .jgrid_hive_min2 {top: 1px; left: 8.9px;}


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

	/* Espacamentos  */
	.jgrid_hive_line_min_a {margin-left: 0px;clear: both;}
	.jgrid_hive_line_min_b {margin-left: 16px;clear: both;}

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

	.jgrid_hive_mic_border {
	  	position: relative;
		width: 23px; 
		height: 17.09px;
		margin: 9.55px 0;
		background-color: transparent;
		border-left: solid 1px transparent;
		border-right: solid 1px transparent;
	}

	/* *********************************** hiveo menor 1 */
	.jgrid_hive_mic1 {
		position: relative;
		width: 20px; 
		height: 11.55px;
		margin: 5.77px 0;
		z-index: 12; 
	}
	.jgrid_hive_mic1:before, .jgrid_hive_mic1:after {
		content: ""; position: absolute; width: 0;
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
	}
	.jgrid_hive_mic1:before {
		bottom: 100%;
		border-bottom-width: 5.77px; border-bottom-style: solid;
	}
	.jgrid_hive_mic1:after {
		top: 100%;
		width: 0;
		border-top-width: 5.77px; border-top-style: solid;
	}
	/* encaixe no mic */
	.jgrid_hive_mic_border .jgrid_hive_mic1 {top: 0px; left: 0px;}


	/* *********************************** hiveo menor 2 */
	.jgrid_hive_mic2 {
		position: relative;
		width: 20px; 
		height: 11.55px;
		margin: 5.77px 0;
		z-index: 12; 
	}
	.jgrid_hive_mic2:before, .jgrid_hive_mic2:after {
		content: ""; position: absolute; width: 0;
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
	}
	.jgrid_hive_mic2:before {
		bottom: 100%;
		border-bottom-width: 5.77px; border-bottom-style: solid;
	}
	.jgrid_hive_mic2:after {
		top: 100%;
		width: 0;
		border-top-width: 5.77px; border-top-style: solid;
	}

	/* encaixe no mic */
	.jgrid_hive_mic_border .jgrid_hive_mic2 {top: 1px; left: 8.9px;}


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

	/* Espacamentos  */
	.jgrid_hive_line_mic_a {margin-left: 0px;clear: both;}
	.jgrid_hive_line_mic_b {margin-left: 11px;clear: both;}


/* --------------------------------------------------------------------------------------------- NANO */

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

	/* *********************************** hiveo menor 1 */



	.jgrid_hive_nano1 {
		position: relative;
		width: 14px; 
		height: 8.08px;
		margin: 4.04px 0;
	}

	.jgrid_hive_nano1:before,
	.jgrid_hive_nano1:after {
		content: "";
		position: absolute;
		width: 0;
		border-left: 7px solid transparent;
		border-right: 7px solid transparent;
	}

	.jgrid_hive_nano1:before {
		bottom: 100%;
		border-bottom: 4.04px solid #64C7CC;
	}

	.jgrid_hive_nano1:after {
		top: 100%;
		width: 0;
		border-top-width:  4.04px;
		border-top-style: solid;
	}

	/* *********************************** hiveo menor 2 */
	.jgrid_hive_nano2 {
		position: relative;
		width: 20px; 
		height: 11.55px;
		margin: 5.77px 0;
		z-index: 12; 
	}
	.jgrid_hive_nano2:before, .jgrid_hive_nano2:after {
		content: ""; position: absolute; width: 0;
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
	}
	.jgrid_hive_nano2:before {
		bottom: 100%;
		border-bottom-width: 5.77px; border-bottom-style: solid;
	}
	.jgrid_hive_nano2:after {
		top: 100%;
		width: 0;
		border-top-width: 5.77px; border-top-style: solid;
	}

	/* encaixe no nano */
	.jgrid_hive_nano_border .jgrid_hive_nano2 {top: 1px; left: 8.9px;}


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

	/* Espacamentos  */
	.jgrid_hive_line_nano_a {margin-left: 0px;clear: both;}
	.jgrid_hive_line_nano_b {margin-left: 8px;clear: both;}


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


	.jgrid_hive_pico_border {
	  	position: relative;
		width: 11px; 
		height: 6px;
		margin: 10px 0;
		background-color: transparent;
		border-left: solid 1px transparent;
		border-right: solid 1px transparent;
	}

	/* *********************************** hiveo menor 1 */



	.jgrid_hive_pico1 {
		position: relative;
		width: 10px; 
		height: 5.77px;
		margin: 2.89px 0;
	}

	.jgrid_hive_pico1:before,
	.jgrid_hive_pico1:after {
		content: "";
		position: absolute;
		width: 0;
		border-left: 5px solid transparent;
		border-right: 5px solid transparent;
	}


	.jgrid_hive_pico1:before {
		bottom: 100%;
		border-bottom-width: 2.89px;
		border-bottom-style: solid;
	}

	.jgrid_hive_pico1:after {
		top: 100%;
		width: 0;
		border-top-width: 2.89px;
		border-top-style: solid;

	}

	/* *********************************** hiveo menor 2 */
	.jgrid_hive_pico2 {
		position: relative;
		width: 20px; 
		height: 11.55px;
		margin: 5.77px 0;
		z-index: 12; 
	}
	.jgrid_hive_pico2:before, .jgrid_hive_pico2:after {
		content: ""; position: absolute; width: 0;
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
	}
	.jgrid_hive_pico2:before {
		bottom: 100%;
		border-bottom-width: 5.77px; border-bottom-style: solid;
	}
	.jgrid_hive_pico2:after {
		top: 100%;
		width: 0;
		border-top-width: 5.77px; border-top-style: solid;
	}

	/* encaixe no pico */
	.jgrid_hive_pico_border .jgrid_hive_pico2 {top: 1px; left: 8.9px;}


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

	/* Espacamentos  */
	.jgrid_hive_line_pico_a {margin-left: 0px;clear: both;}
	.jgrid_hive_line_pico_b {margin-left: 5px;clear: both;}

/*

.hexagon {
  position: relative;
  width: 10px; 
  height: 5.77px;
  background-color: #64C7CC;
  margin: 2.89px 0;
}

.hexagon:before,
.hexagon:after {
  content: "";
  position: absolute;
  width: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
}

.hexagon:before {
  bottom: 100%;
  border-bottom: 2.89px solid #64C7CC;
}

.hexagon:after {
  top: 100%;
  width: 0;
  border-top: 2.89px solid #64C7CC;
}

*/


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

		       __
		     /    \
		    |      |
		    |      |
		     \    /
		       --

*/
.jgrid_hive_border_no_b1:before {border-top-color: transparent}
.jgrid_hive_border_no_b2:before {border-right-color: transparent;}
.jgrid_hive_border_no_b3 {border-right-color: transparent;}
.jgrid_hive_border_no_b4:after {border-bottom-color: transparent;}
.jgrid_hive_border_no_b5:after {border-left-color: transparent;}
.jgrid_hive_border_no_b6 {border-left-color: transparent;}

/* nenhuma borda */
.jgrid_hive_bnb { border-right-color: transparent; border-left-color: transparent; }
.jgrid_hive_bnb:before { border-top-color: transparent; border-right-color: transparent;}
.jgrid_hive_bnb:after { border-bottom-color: transparent;border-left-color: transparent;}

/*
	Estilos 
		- Espacamentos
*/
/* organizacao de linhas e hiveos */
.jgrid_hive_line {clear: both;}
.jgrid_hive_cell {}
.jgrid_hive_line_first {}
.jgrid_hive_line_second {}
.jgrid_hive_line_middle {}
.jgrid_hive_line_last {}
/* aproximar proximas linhas */
.jgrid_hive_line_first, .jgrid_hive_line_middle, .jgrid_hive_line_second {margin-bottom: -17px;}
/* apenas 1 linha */
.jgrid_hive_line_single {}
/* .jgrid_hive_line_first { margin-bottom: -25px; } */




