ml2scratch/old/app/stylesheets/styles/components/_header.scss

.header {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  padding: 40px 0 20px;

  &__links {
    flex: 1 0 100%;
    text-align: center;
    margin-top: 40px;

    ul {
      list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
      justify-content: center;
      align-items: center;

      li {
        display: inline-block;

        &:before {
          @include font(.75rem);
          content: '|';
          display: inline-block;
          margin: 0 .2rem;
        }

        &:first-child {
          &:before {
            display: none;
          }
        }

        a {
          @include font(.875rem);
          color: $color-black;
          text-decoration: none;

          &:hover {
            color: $color-blue;
            text-decoration: underline;
          }
        }
      }
    }
  }
}