nav.scss

.nav {
  margin: 0 auto;
  float: none;
  width: 100%;
  padding-top: 40px;
  padding-bottom: 20px;
  position: fixed;
  z-index: 999;
  > li {
    display: table-cell;
    float: none;
    text-align: center;
    font-weight: 700;
  }
  .btn-link {
    margin: 0 auto;
  }
  &.about {
    background-color: $color-navy;
    h1 {
      color: $color-white;
    }
    .nav-button-group {
      color: $color-white;
    }
    .btn-nav {
      fill: $color-white;
    }
  }
  h1, .h1 {
    text-align: center;
    margin-top: -20px;
    &.page-header {
      text-transform: capitalize;
      @include media-breakpoint-only(md) {
        font-size: 5rem;
      }
      @include media-breakpoint-down(sm) {
        font-size: 4rem;
      }
    }
  }
  a {
    text-decoration: none;
  }
}

.button-label-container {
  margin-top: -10px;
}

.nav-button-group {
  font-size: 1em;
  font-weight: $font-weight-semibold;
  .icon {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    width: 50px;
    height: 50px;

  }
  .btn-nav {
    fill: $color-meditate;
    &:focus, &:hover {
      fill: $color-white;
    }
  }
}

.app-activity-read,
.app-activity-create,
.app-activity-meditate {
  .nav-button-group {
    color: $color-navy;
    .icon {
      fill: $color-navy;
    }
  }
}
.app-activity-wyrd, .app-activity-focus  {
  .nav-button-group {
    color: $color-white;
    .icon {
      fill: $color-white;
    }
  }
}