.primary-navigation li {
		border 0:	
  display: inline-block;
  font-family: Book Antiqua;
  font-size: 0.7em;
		height: 6
    1rem; (reduce this to reduce height of navbar)
		line-height: 0.6rem; reduce this to reducew height of hover colour)
		position: relative;
		text-align: left;
}
nav li{
  display:inline-block;
  border-bottom:2px inset #0A1B2A;
  margin-left:-20px;
}
nav a{
  color:#0A1B2A;
  background:#0A1B2A;
  position:relative;
  display:inline-block;
  margin:0 20px;
  padding:4px 7px;
  text-shadow: 1.5px 1.7px 0 rgba(2,0,0,0.4);
  border-radius:2px 2px 0 0; /* just to smooth the top edges */
}
nav a:before,
nav a:after{
  content:" ";
  position: absolute;
  top:0;
  width: 26px;
  height: 100%;
  background-color: inherit; 
}
nav a:before{
  border-radius: 8px 0 0 0;
  transform: skew(-10deg);
  left: -16px; /* play with this one to give the LI border ~2px extrusion */
}
nav a:after{
  border-radius: 0 12px 0 0;
  transform: skew(10deg);
  right: -16px; /* play with this one to give the LI border ~2px extrusion */
  border-right: 1px solid #56514C;
  z-index: 1; /* overlap next element */
}
/* LI ACTIVE  */
nav li.active{
   border-bottom:1px solid #0A1B2A;
}
nav li.active a{
  color:#56514C;
  background:#56514C;
}
nav li.active a:before{
  z-index: 1; /* overlap prev element */
}
nav li.active a:after{
   border-bottom:1px solid #fff;
}