/*
	stylus-boilerplate

	nav.styl

	Author: Sean Goresht

	Basic navigation component styles
*/
.nav-vertical,
.nav-horizontal {
  padding: 0;
  background: #3b7ea8;
  box-sizing: border-box;
}
.nav-vertical .nav-item {
  border-width: 0 0 1px 0;
}
.nav-vertical .nav-item,
.nav-vertical .nav-item-link {
  display: block;
  width: 100%;
}
.nav-horizontal .nav-item {
  border-width: 0 $borderWidth 0 0;
media-query($breakpointMain)
  display: inline-block;
  margin-right: 0;
}
.nav-items {
  list-style: none;
  margin: 0;
  padding: 0;
}
.nav-item {
  border: 1px solid color-fallback(rgba(255,255,255,0.3));
  position: relative;
}
.nav-item:last-child {
  border: 0;
}
.nav-item-link {
  box-sizing: border-box;
  padding: 0.7em;
  display: block;
  text-decoration: none;
  color: #fff;
  transition: background, 0.5s, easing("in-quad");
}
.nav-item-link:hover,
.nav-item-link:focus {
  background: rgba(0,0,0,0.1);
}