lintel-contrib-navs/dist/navs.css

Navigation tools for lintel.

.nav-list {
  list-style: none;
  padding-left: 0; }
  .nav-list:before, .nav-list:after {
    content: " ";
    display: table; }
  .nav-list:after {
    clear: both; }
  .nav-list > li {
    float: left; }
    .nav-list > li > a {
      display: block;
      padding: 10px 12px;
      text-decoration: none; }

.nav-tabs {
  border-bottom: 1px solid #ececec; }
  .nav-tabs > li {
    margin-bottom: -1px;
    margin-right: 4px; }
    .nav-tabs > li > a {
      background: transparent;
      border: 1px solid transparent;
      border-bottom-color: #ececec;
      border-top-left-radius: 4px;
      border-top-right-radius: 4px;
      color: #868686;
      display: block;
      position: relative; }
      .nav-tabs > li > a:hover, .nav-tabs > li > a:focus {
        border-color: transparent transparent #ececec;
        color: #4b77be; }
  .nav-tabs > .active > a, .nav-tabs > .active > a:hover, .nav-tabs > .active > a:focus {
    background: #fff;
    border-color: #ececec #ececec transparent;
    color: #4b77be; }

.nav-tabs-y {
  border-bottom: 0; }
  .nav-tabs-y > li {
    float: none;
    margin-bottom: 4px; }
    .nav-tabs-y > li > a {
      border-bottom-color: transparent; }

.nav-tabs-y-left {
  border-left: 1px solid #ececec; }
  .nav-tabs-y-left > li {
    margin-left: -1px; }
    .nav-tabs-y-left > li > a {
      border-left-color: #ececec;
      border-top-left-radius: 0;
      border-bottom-right-radius: 4px; }
      .nav-tabs-y-left > li > a:hover, .nav-tabs-y-left > li > a:focus {
        border-color: transparent transparent transparent #ececec; }
  .nav-tabs-y-left > .active > a, .nav-tabs-y-left > .active > a:hover, .nav-tabs-y-left > .active > a:focus {
    border-color: #ececec #ececec #ececec transparent; }

.nav-tabs-y-right {
  border-right: 1px solid #ececec; }
  .nav-tabs-y-right > li {
    margin-right: -1px; }
    .nav-tabs-y-right > li > a {
      border-right-color: #ececec;
      border-top-right-radius: 0;
      border-bottom-left-radius: 4px; }
      .nav-tabs-y-right > li > a:hover, .nav-tabs-y-right > li > a:focus {
        border-color: transparent #ececec transparent transparent; }
  .nav-tabs-y-right > .active > a, .nav-tabs-y-right > .active > a:hover, .nav-tabs-y-right > .active > a:focus {
    border-color: #ececec transparent #ececec #ececec; }

.nav-pills > li {
  margin-right: 4px; }
  .nav-pills > li > a {
    border: 1px solid transparent;
    border-radius: 4px;
    color: #868686; }
    .nav-pills > li > a:hover, .nav-pills > li > a:focus {
      border-color: #ececec;
      color: #4b77be; }
.nav-pills > .active > a, .nav-pills > .active > a:hover, .nav-pills > .active > a:focus {
  background: #4b77be;
  border-color: #4b77be;
  color: #fff; }

.nav-pills-y > li {
  float: none;
  margin-bottom: 10px; }

.nav-flat {
  border-bottom: 3px solid #ececec; }
  .nav-flat > li {
    margin-bottom: -3px;
    margin-right: 20px; }
    .nav-flat > li > a {
      color: #868686;
      border-bottom: 3px solid #ececec;
      padding: 8px 0; }
      .nav-flat > li > a:hover, .nav-flat > li > a:focus {
        border-color: #cccccc;
        color: #333333; }
  .nav-flat > .active > a, .nav-flat > .active > a:hover, .nav-flat > .active > a:focus {
    border-color: #4b77be;
    color: #4b77be; }

.nav-flat-y {
  border-bottom: 0;
  border-left: 3px solid #ececec; }
  .nav-flat-y > li {
    float: none;
    margin-bottom: 10px;
    margin-left: -3px; }
    .nav-flat-y > li:last-child {
      margin-bottom: 0; }
    .nav-flat-y > li > a {
      border-bottom: 0;
      border-left: 3px solid #ececec;
      padding-left: 10px; }