nav .active:before, nav .active a:before,nav .first:before, nav .first a:before{
	position: absolute;		/*position of squares & triangles of active & first li*/
	content: "";
	bottom: 0;				/*position in bottom*/
}
nav .active:before, nav .first:before{ 
	width: 20px; 			/*creating the square*/
	height: 20px;
	left: -18px;   			/*positioning*/
}
nav .first:before{
	background: #001133;	/*color of square in home*/
	z-index: 0;
}
nav .active:before{
	background: #001a4d;	/*active tab square bg*/
	z-index: 1;  			/*square index in active tab*/
}
nav .active a:before, nav .first a:before{
	width: 0;							/*CREATING TRIANGLE*/
	height: 0;
	border-bottom: 20px solid transparent;
	left: -18px;								/*POSITIONING TRIANGLE*/
}
nav .active a:before{
	z-index: 2;
	border-left: 20px solid #001133;  /*color of triangle in active tab*/
}
nav .first a:before{
	z-index: 1;
	border-left: 20px solid white;  /*color of triangle in home*/
}